通過調用 $rootScope 中定義的方法從 $rootScope 訪問 $scope？

Question

我在 $rootScope 上定義了一個方法

$rootScope.method = function(value){
    // wanna give this value to `$scope.value` below:
};

我從一個完全不同的 $scope 調用它

app.controller('some', function($scope){
    $scope.value = null;    
});

<div ng-controller="some">
    <input ng-model="value">
    <button ng-click="method(value)" >Click</button>
</div>

是否可以（如果可以，如何？）從 $rootScope 上定義的方法訪問本地化的 $scope 並更改其屬性？

我以為this會起作用， 但它不起作用

$rootScope.method = function(value){
    this.value = value // "this" is not the $scope
};

---

編輯：實際上它確實有效。 在我添加這個演示腳本后才發現它確實像我希望的那樣工作

 angular.module('app', []) .controller('main', function($rootScope) { $rootScope.method = function(value) { this.changedValue = 'changed ' + value; } }) .controller('some', function($scope) { // $scope.changedValue = 'not working'; }) .controller('someOther', function($scope) { $scope.changedValue = 'this should not change'; });

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app"> <div ng-controller="main"> </div> <div ng-controller="some"> <input ng-model="value"></input> <button ng-click="method(value)">Click</button> {{changedValue}} </div> <div ng-controller="someOther"> {{changedValue}} </div> </div>

Answer 1

scope 是一個層次樹，rootScope 位於頂部，控制器作用域作為子作用域。 如果您更改附加到 rootscope 的值，它將對兩個控制器都可用，即如果在 ControllerA 中設置 $rootscope.value = 1，則控制器 B 可以訪問 $rootScope.value。

但是，如果可以避免的話，不建議將值附加到 rootScope。 它在 angular 中被視為不好的做法，類似於在 javascript 中設置全局值。

更好的方法是創建一個服務並將其注入到兩個控制器中。 該服務可以包含兩個控制器所需的任何方法或值。 您可以使用控制器 A 中定義的方法調整服務中的值並訪問控制器 B 中的服務值。

或者，您可以使用 $broadcast 來觸發自定義事件。 這會沿着作用域鏈向下傳播，因此在控制器 A 中：

$rootScope.$broadcast('CUSTOM_EVENT_NAME', args);

控制器B

$scope.$on('CUSTOM_EVENT_NAME', function(ev, args) {
  //some code here
  //args are those passed from controllerA
});

但我會推薦一項服務作為更好的方式

Answer 2

你可以這樣做：

$rootScope.method = function(value){
    // wanna give this value to `$scope.value` below:
   $rootScope.value=value;
};


app.controller('some', function($scope,$rootScope){
    $rootScope.value = null;    
});

html：

<div ng-controller="some">
    <input ng-model="value">
    <button ng-click="method(value)" >Click</button>
</div>