Update parent scope variable in AngularJS
You need to use an object (not a primitive) in the parent scope and then you will be able to update it directly from the child scope
Parent:
app.controller('ctrlParent',function($scope){
$scope.parentprimitive = "someprimitive";
$scope.parentobj = {};
$scope.parentobj.parentproperty = "someproperty";
});
Child:
app.controller('ctrlChild',function($scope){
$scope.parentprimitive = "this will NOT modify the parent"; //new child scope variable
$scope.parentobj.parentproperty = "this WILL modify the parent";
});
Working demo: http://jsfiddle.net/sh0ber/xxNxj/
See What are the nuances of scope prototypal / prototypical inheritance in AngularJS?
There is one more way to do this task and to not use the $scope.$parent
variable.
Just prepare a method for changing the value in parent scope and use it in child one. Like this:
app.controller('ctrlParent',function($scope) {
$scope.simpleValue = 'x';
$scope.changeSimpleValue = function(newVal) {
$scope.simpleValue = newVal;
};
});
app.controller('ctrlChild',function($scope){
$scope.changeSimpleValue('y');
});
It also works and give you more control over the value changes.
You can then also call the method even in HTML like: <a ng-click="changeSimpleValue('y')" href="#">click me!</a>
.