Question

后，

对angularJS来说是新手

如果所有控制器在$rootScope中共享ng-app，我们是否可以共享分配给$rootScope的ng-model，以便控制器可以相互通信？

使用以下代码段进行测试，但gName model在inputController发生变化后无法更改，假设输入时gName可能再次$scope.gName改变。如果这是真的，有没有办法让控制器相互通信？即，输入可以显示在其他控制器？

＆＃13;

var app = angular.module("myApp",[]);

app.controller("inputController",    ["$rootScope", "$scope", function($rootScope, $scope){
            $rootScope.gName = "Hello";
   }])
   .controller("displayController1", ["$rootScope", "$scope", function($rootScope, $scope){
   }])
   .controller("displayController2", ["$rootScope", "$scope", function($rootScope, $scope){
   }]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
        <hr/>
        <div ng-controller="inputController">
            <input type="text" ng-model="gName"/> <br/>
            <span>{{gName}}</span>
        </div>
        <hr/>
        <div ng-controller="displayController1">
            <span>{{gName}}</span>
        </div>
        <hr/>
        <div ng-controller="displayController2">
            <span>{{gName}}</span>
        </div>
</body>

＆＃13;

Answer 1

您不希望控制器彼此通信，因为控制器的唯一目的是从视图转换数据并为视图转换数据并处理视图本地逻辑（比如隐藏带有复选框的内容，预览计算出的数字等等）上）。

您的实际数据和业务逻辑应该在服务中，这也允许多个控制器访问它。

Answer 2

通过controllers在您的应用和应用services内共享逻辑/数据。最大的好处是digest cycle不受更改的影响，并且您的逻辑/数据可以轻松地以结构化/分离的方式在您的应用程序中共享。服务的使用减少了您的可读性污染。

我尝试仅使用$rootScope进行事件广播/收听以及主应用程序框架上的数据附加（例如应用程序外框中的数据）。

AngularJS服务是：

懒惰地实例化 - 当应用程序组件依赖它时，AngularJS仅实例化服务。
单身人士 - 依赖于服务的每个组件都会获得对服务工厂生成的单个实例的引用。

详细示例可以通过https://thinkster.io/a-better-way-to-learn-angularjs/services

上的教程进行

Answer 3

在AngularJS中，$ scope继承自其父作用域（最后它将是rootScope）

在Angular中，当孩子改变它们时，原始类型会被覆盖。因此，在更改%x时的输入中，保留gName并创建仅在该控制器上显示的新本地$rootScope.gName

解决问题，你可以添加一个对象，并更改其中的属性

＆＃13;

$scope.gName

＆＃13;

var app = angular.module("myApp",[]);

app.controller("inputController",    ["$rootScope", "$scope", function($rootScope, $scope){
            $rootScope.prop = { gName: "Hello" };
   }])
   .controller("displayController1", ["$rootScope", "$scope", function($rootScope, $scope){
   }])
   .controller("displayController2", ["$rootScope", "$scope", function($rootScope, $scope){
   }]);

＆＃13;

注意我只是回答这个问题，建议不要让这种方式让控制器互相通信，你应该使用服务，你可以查看guide

是否可以在ng-model中绑定全局变量？

3 个答案: