我有两个控制器,一个包裹在另一个控制器中。现在我知道子范围从父范围继承属性,但有没有办法更新父范围变量?到目前为止,我没有遇到任何明显的解决方案。
在我的情况下,我在表单中有一个日历控制器。我想从父作用域(即表单)更新开始日期和结束日期,以便表单在提交时具有开始日期和结束日期。
答案 0 :(得分:188)
您需要在父作用域中使用对象(而不是基元),然后您才能直接从子作用域更新它
<强>父:强>
app.controller('ctrlParent',function($scope){
$scope.parentprimitive = "someprimitive";
$scope.parentobj = {};
$scope.parentobj.parentproperty = "someproperty";
});
儿童:强>
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";
});
工作演示:http://jsfiddle.net/sh0ber/xxNxj/
请参阅What are the nuances of scope prototypal / prototypical inheritance in AngularJS?
答案 1 :(得分:115)
还有一种方法可以执行此任务,而不使用$scope.$parent
变量。
只需准备一个方法来更改父范围中的值并在子视图中使用它。像这样:
app.controller('ctrlParent',function($scope) {
$scope.simpleValue = 'x';
$scope.changeSimpleValue = function(newVal) {
$scope.simpleValue = newVal;
};
});
app.controller('ctrlChild',function($scope){
$scope.changeSimpleValue('y');
});
它也有效,让您可以更好地控制价值变化。
您甚至可以在HTML中调用该方法,如:<a ng-click="changeSimpleValue('y')" href="#">click me!</a>
。
答案 2 :(得分:5)
这也有效(但不确定这是否遵循最佳实践)
app.controller('ctrlParent',function($scope) {
$scope.simpleValue = 'x';
});
app.controller('ctrlChild',function($scope){
$scope.$parent.simpleValue = 'y';
});
答案 3 :(得分:4)
将范围属性分配给范围时,即使父范围具有同名属性,范围始终本地(可能是动态创建)。这是一个设计决定,也是一个很好的恕我直言。
如果您需要在视图中更改父作用域中的某些原语(整数,布尔值,字符串),则需要将其作为该作用域中另一个对象的属性,因此赋值可能为:
<a ng-click="viewData.myAttr = 4">Click me!</a>
反过来:
viewData
对象
myAttr
属性。答案 4 :(得分:2)
为了访问父级中声明的变量,我们应该在子控制器或模板文件中使用$ parent
在控制器中
$scope.$parent.varaiable_name
在html模板中
ng-model="$parent.varaiable_name"