更新 AngularJS 中的父作用域变量

javascript angularjs prototype angularjs-controller angularjs-scope

2022-08-30 05:36:32

我有两个控制器，一个包裹在另一个控制器中。现在我知道子作用域从父作用域继承属性，但是有没有办法更新父作用域变量？到目前为止，我还没有遇到任何明显的解决方案。

在我的情况下，我在表单中有一个日历控制器。我想从父范围（即表单）更新开始日期和结束日期，以便表单在提交时具有开始日期和结束日期。

答案 1

您需要在父作用域中使用对象（而不是基元），然后才能直接从子作用域更新它

父母：

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/

请参阅AngularJS中范围原型/原型继承的细微差别是什么？

答案 2

还有一种方法可以执行此任务并且不使用该变量。$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>