是否可以在ng模型中綁定一個全局變量？

新angularJS，閱讀Reference about Scope 是否可以在ng模型中綁定一個全局變量？

如果所有控制器共享$rootScope在ng-app後，才能分享其分配給$rootScope，使控制器可以相互通信的NG-模式？

測試與下面的代碼段，但gName失敗時model在inputController改改，假設可能是gName再次取得$scope.gName當輸入改變。如果這是真的，有沒有辦法與控制器相互溝通？即輸入可以顯示在其他控制器中？

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){ 
 
    }]);

<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>

來源

2017-02-09 armnotstrong

您可以使用'services'在'controllers'之間共享數據 –

在AngularJS的教程之後，$範圍從其父範圍繼承（並最終將是rootScope）

在角，原始當孩子改變他們時，類型被覆蓋。所以在輸入切換時gName它是保持$rootScope.gName並創建一個新的本地$scope.gName即只表明控制器

來解決，你可以添加對象的問題，並在它更改屬性

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){ 
 
    }]);

<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="prop.gName"/> <br/> 
 
      <span>{{prop.gName}}</span> 
 
     </div> 
 
     <hr/> 
 
     <div ng-controller="displayController1"> 
 
      <span>{{prop.gName}}</span> 
 
     </div> 
 
     <hr/> 
 
     <div ng-controller="displayController2"> 
 
      <span>{{prop.gName}}</span> 
 
     </div> 
 
</body>

注意，我只回答這個問題，不建議做控制器，每個人，你應該使用該服務進行通信這種方式，您可以檢查此guide

來源

2017-02-09 11:35:22

感謝您解釋@Nadeem Khedr – armnotstrong