Question

我的controller通过使用状态文件与html绑定，但我希望同一controller也可以与其他页面一起使用。但该页面有自己的controller，这就是我使用controller属性将ng-controller包含到特定div中的原因。现在我的第一页与controller正确绑定，第二页也与同一controller绑定，但问题是当我在第一页进行一些更改时，这些更改不会反映回第二页。< / p>

我怎样才能做到这一点？

有关如何实现这一目标的任何好建议？

以下是 PLUNKER DEMO

我想反映一次更改时的变化。

Answer 1

让父母控制器为你工作吗？我建议的另一种方法是使用服务在控制器之间共享数据

https://plnkr.co/edit/WensNuLiluYcnDyAEIhu?p=preview

<div ng-controller="ParentController">
      <div ng-controller="Mycontroller">
  <p>Hello {{$parent.name}}!</p>
  <label>Name:
    <input ng-model="$parent.name" type="text" />
  </label>
</div>
<div ng-controller="Mycontroller">
  <p>Hello {{$parent.name}}!</p>
  <label>Name:
    <input ng-model="$parent.name" type="text" />
  </label>
</div>
</div>



var app = angular.module('plunker', []);

app.controller('Mycontroller', function($scope) {
});

app.controller('ParentController', function($scope) {
    $scope.name = 'World';
});

使用服务 https://plnkr.co/edit/OWi9LGGkFVorg13kDNaO?p=preview

<div ng-controller="Mycontroller">
  <p>Hello {{myService.name}}!</p>
  <label>Name:
    <input ng-model="myService.name" type="text" />
  </label>
</div>
<div ng-controller="Mycontroller">
  <p>Hello {{myService.name}}!</p>
  <label>Name:
    <input ng-model="myService.name" type="text" />
  </label>
</div>

var app = angular.module('plunker', []);

app.controller('Mycontroller', function($scope, MyService) {
    $scope.myService = MyService;
});


app.service("MyService", function() {
  this.name = "World";
});

如何在同一页面上为Divisions分配一个控制器而不使用$ rootScope

1 个答案: