AngularJS - Deep object' property deletion

Question

I know how to set object' "deep" property with $parse service , like in this post.

But how can i delete a deep property ? Not assign it to null with this:

$parse('very.very.deep.property').assign($scope, null);

, but actually delete it, like we're doing it in JavaScript:

delete $scope.very.very.deep.property;

Answer 1

I am afraid that there is no Angular service/function for what you are looking for. But you can still implement something like the following to fulfill your requirement :

function Ctrl($scope,$parse){
  var path = 'very.very.deep.property';
  var partials = path.split('.');
  var deepKey = partials.pop(); //Extract the key name from your path
  var deepPath = partials.join('.'); //Build the parent's path
  var deep = $parse(deepPath);
  var prop = $parse(path);
  prop.assign($scope, "I'm so deep");
  delete deep($scope)[deepKey]; //Evaluate the deep path against your scope and delete the key
  console.log(deepKey, $scope.very.very.deep)
}

A fiddle is available here. Hope this would come handy.