Javascript 我在AngularJS中有两个具有相同ng控制器的div，如何让它们共享信息？

我的html代码中有两个不同的div标记，它们引用AngularJS中的同一个控制器。我怀疑的是，由于这些div不是嵌套的，它们各自都有自己的控制器实例，因此两者的数据是不同的

<div ng-controller="AlertCtrl">
<ul>
    <li ng-repeat="alert in alerts">
        <div class="span4">{{alert.msg}}</div>
    </li>
</ul>
</div>        
<div ng-controller="AlertCtrl">
<form ng-submit="addAlert()">
    <button type="submit" class="btn">Add Alert</button>
</form>
</div>

---

这是一个非常常见的问题。似乎最好的方法是创造服务/价值并在两者之间共享

mod.service('yourService', function() {
  this.sharedInfo= 'default value';
});


function AlertCtrl($scope, yourService) {
  $scope.changeSomething = function() {
    yourService.sharedInfo = 'another value from one of the controllers';
  }

  $scope.getValue = function() {
    return yourService.sharedInfo;
  }
}

{{getValue（）}
{{getValue（）}}

如果我正确理解了这个问题，您希望用同一个控制器同步两个html区域，保持数据同步

由于这些div不是嵌套的，它们各自有自己的控制器实例，因此两者的数据不同

如果您使用相同的别名声明控制器（我使用的是更多recente angular版本），则情况并非如此：

{{instance.someVar}}
{{instance.someVar}}（与上面相同）

但是，如果您希望它们不同并相互通信，则必须声明不同的别名：

<div ng-controller="AlertCtrl as instance1">
  {{instance1.someVar}}
</div>
<div ng-controller="AlertCtrl as instance2">
  {{instance2.someVar}} (this will not necessarily be the same as above)
</div>

{{instance1.someVar}}
{{instance2.someVar}}（不一定与上面相同）

---

然后，您可以使用服务或广播在它们之间进行通信（第二个应该避免，很难）。

为什么要使用AlertCtrl？这将产生控制器的第二个实例，每个控制器功能需要一个

ng控制器

，称它为twiceI毫无意义我想你只是想引入另一个

div

来包装你所拥有的，并将控制器向上移动一个级别，这样你只需要一个实例。我尝试了你的例子，但不幸的是，当我将“yourService”添加到控制器参数时，我的页面崩溃了。任何与角度相关的东西都不起作用。有什么建议吗？你有

mod

变量吗？您需要

var mod=angular.module（'my-app'，[]）和我们的html
…
。错误是什么？因为我想按你的方式做，但没有成功。我必须广播这一事件，然后在需要的地方捕捉到它。在我的要求中，我在一个控制器中有按钮，在另一个控制器中有表单，需要在单击按钮时可见，状态更新不起作用。上面语法起作用的AngularJS的最旧版本是什么（AlertCtrl作为实例）？版本1.2（）
<div ng-controller="AlertCtrl">{{getValue()}}</div>
<div ng-controller="AlertCtrl">{{getValue()}}</div>

<div ng-controller="AlertCtrl as instance">
  {{instance.someVar}}
</div>
<div ng-controller="AlertCtrl as instance">
  {{instance.someVar}} (this will be the same as above)
</div>

<div ng-controller="AlertCtrl as instance1">
  {{instance1.someVar}}
</div>
<div ng-controller="AlertCtrl as instance2">
  {{instance2.someVar}} (this will not necessarily be the same as above)
</div>