Question

我有一个部分视图，它包含在多个页面中。部分视图在NgController上有。当我在另一个内部时，有没有办法可以访问该特定嵌套控制器的范围变量？

例如：

<div ng-controller="fooController">

    <a ng-click="changeScopeVariableOfBarController()">Click!</a>

    <div ng-controller="barController">
        {{ thisHasToChangePlease }}
    </div>
</div>

这可能吗？我无法弄清楚如何。我用php的include包含部分视图，所以我不使用模板。

Answer 1

如果您有可重用的组件＆＃34; （模板+功能）您可以将其重构为指令而不是模板+控制器。然后，使用带参数的隔离范围，可以让外部世界以这种方式改变指令的内部。

http://plnkr.co/edit/6JYVucuizmPkyt2CLQtr?p=preview

<强>的index.html

<div ng-controller="fooController">
  <div>variable: {{ variable }}</div>
  <button ng-click="changeScopeVariableOfBarController()">Click to increment variable on both scopes!</button>
  <bar this-has-to-change-please="variable"></bar>
</div>

<强>一个bar.html

<div>
    thisHasToChangePlease: {{ thisHasToChangePlease }}
</div>

<强> app.js

app.controller('fooController', function($scope) {
  $scope.variable = 1;

  $scope.changeScopeVariableOfBarController = function () {
    $scope.variable++;
  };
});

app.controller('barController', function ($scope) {

});

app.directive('bar', function () {
  return {
    restrict: 'E',
    scope: {
      thisHasToChangePlease: '='
    },
    controller: 'barController',
    templateUrl: 'bar.html'
  }
});

角度访问/更改嵌套的ng-controller变量？

1 个答案: