Cannot delete Javascript object and make fresh instance in angular js scope

Question

I have a strange problem with creating fresh copy of JavaScript object and assigned to $scope. This object is bind to frontend form, so I must reset the data of this object. Here is the code: This is JavaScript class:

var userInfo = (function () {
  function userInfo() {}

  var _refCode = "";
  var _country = {};
  var _language = {};
  var _userType = 0;
  var _retailer = {};

  userInfo.prototype.data = {
    refCode: function (value) {
      return angular.isDefined(value)
        ? (_refCode = value)
        : _refCode;
    },
    country: function (value) {
      return angular.isDefined(value)
        ? (_country = value)
        : _country;
    },
    language: function (value) {
      return angular.isDefined(value)
        ? (_language = value)
        : _language;
    },
    userType: function (value) {
      return angular.isDefined(value)
        ? (_userType = value)
        : _userType;
    },
    retailer: function (value) {
      return angular.isDefined(value)
        ? (_retailer = value)
        : _retailer;
    }
  }

  return userInfo;
})();

this is my angular controller:

app.controller('MainController', function ($scope, $http, $state) {
  $scope.initUserInfo = function () {

    //here make instance of the class
    var user_info = new userInfo();

    delete $scope.userInfo;
    $scope.userInfo = user_info;
  };

  $scope.initUserInfo();
});

But when I call the function initUserInfo() nothing happens. The data in $scope.userInfo is still there. What have I done wrong and how to delete information from userInfo?

UPDATE:

Thanks, I make changes and now my code look like, but when I

console.log

I have following error:

Cannot read property 'data' of undefined - on the first console.log

print old value - on second console.log

print old value - on third console.log

Аfter the execution of this function that was before her performance remains not erased.

   $scope.initUserInfo = function () {
    delete $scope.userInfo;
    var user_info = null;
    console.log("after delete: " + $scope.userInfo.data.refCode());//first console log
    user_info = new userInfo();
    $scope.userInfo = user_info;
    console.log("after assing: " + $scope.userInfo.data.refCode());
    $scope.userInfo.data.createdStore(new addStoreData());
    $scope.userInfo.merge(verifiedEmployee);
    $scope.verifiedEmployee = verifiedEmployee;
    console.log($scope.userInfo.data.refCode());
    };

Why not something like $scope.userInfo= {} ??

Manu Obre
– Manu Obre

2017-01-09 13:27:40 +00:00
Commented Jan 9, 2017 at 13:27 — Manu Obre
– Manu Obre, Commented Jan 9, 2017 at 13:27
@ManuelObregozo and tried it, but without success

Dimitar Manovski
– Dimitar Manovski

2017-01-09 13:53:04 +00:00
Commented Jan 9, 2017 at 13:53 — Dimitar Manovski
– Dimitar Manovski, Commented Jan 9, 2017 at 13:53

GProst · Accepted Answer · 2017-01-09 16:35:08Z

1

Well, in my opinion everything works as it should. The data property will be set in each object constructed by new userInfo(). Because you set this property in prototype.

So, here is what your code do:

1) You create new instance of userInfo() which you save in user_info. Now user_info has data property.
2) You delete property userInfo of $scope object, whatever it was. Now $scope.userInfo is undefined. But the origin function userInfo still exists, because you didn't delete it. Also you actually can't delete it with delete keyword, because you created it using var keyword (while so it becomes non-configurable). More about delete operator
3) You reassign userInfo property of $scope object to earlier created (and still existed, of course) user_info, which is an instance of origin userInfo and has data property. So now $scope.userInfo has data property.

In total, if you want to delete information in $scope.userInfo then you did it right: delete $scope.userInfo. If you want to delete information in origin userInfo function, you can do so for example: userInfo = null.

Here is plunker with your code.

answered Jan 9, 2017 at 16:35

GProst

10.3k3 gold badges28 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Marco Over a year ago

Adding to pay attention to $scope.apply() function!

Dimitar Manovski Over a year ago

@GProst i make some changes and this is my final code , but the problem is not solved.

Collectives™ on Stack Overflow

Cannot delete Javascript object and make fresh instance in angular js scope

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related