如何在angularjs的兩個控制器之間共享$ scope屬性，而不是其值？

Question

我是AJ的新手，並且嘗試與另一個控制器共享$ scope.showdropdown指令，以便第二個控制器可以在其主體中調用此指令。

這就是我要的：

.controller('firstCtrl', function($scope){
    $scope.showdropdown = false; // this is part of this controller 

})

.controller('secondCtrl', function($scope){
   if(username and pass correct){
      $scope.showdropdown = true; // I want to call this here, but I can't do it bcoz its not part of the same controller!!! 
   }
})

我嘗試了各種事情，工廠等，但沒有運氣。有人可以告訴我如何做到這一點！

Answer 1

如果只需要在控制器之間共享簡單數據（即沒有功能，驗證或其他模型邏輯），則可以使用value服務：

.controller('firstCtrl', function($scope, myVal){
    $scope.shared = myVal; // 'shared' on scope now references value service
    $scope.shared.showdropdown = false;

})
.controller('secondCtrl', function($scope, myVal){
   $scope.shared = myVal;
   if(username and pass correct){
      $scope.shared.showdropdown = true; // updates myVal value
   }
})
.value('myVal', {}) // register service, initializing with an object object

演示版

factory或service服務類型的概念相同，實現也非常相似。 如果您需要共享功能，而不僅僅是數據，請選擇其中之一。 工廠示例：

.controller('firstCtrl', function($scope, MyFactory){
    $scope.shared = MyFactory;
    ...
})
.controller('secondCtrl', function($scope, MyFactory){
    $scope.shared = MyFactory;
    ...
})
.factory('MyFactory', function(){
    var obj = {
        //showdropdown: false
    };

    obj.someFunc = function(){};

    return obj;
})

Answer 2

<!-- Nested Scopes -->
<div ng-controller="ParentCtrl">
<p>Parent Scope</p>
<ul>
    <li> {{ford}}</li>
    <li> {{chevy}}</li>
    <li>{{dodge}}</li>
</ul>

<div ng-controller="ChildCtrl">
    <p>Child Scope</p>
    <ul>
        <li> {{apple}}</li>
        <li> {{samsung}}</li>
        <li>{{motorola}}</li>
    </ul>

    <div ng-controller="AnotherChildCtrl">
        <p>2nd Child Scope</p>
        <ul>
            <li> {{boeing}}</li>
            <li> {{grumman}}</li>
            <li>{{lockheed}}</li>
        </ul>

        <p>Combination of three scopes</p>
        <ul>
            <li> From parent - {{ ford }}</li>
            <li> From child - {{ motorola }}</li>
            <li> From anotherChild  - {{ lockheed }}</li>
        </ul>

    </div>
</div>

The result looks like this …
Parent Scope
•   Mustang
•   Corvette
•   Charger
Child Scope
•   iPhone
•   Galaxy
•   MotoX
2nd Child Scope
•   747
•   F-14
•   F-35
Combination of three scopes
•   From parent - Mustang
•   From child - MotoX
•   From anotherChild - F-35

如果您需要訪問父范圍之外的范圍（在此示例中），請不要！ 配置代碼，以使所需的作用域在當前作用域中可用–或者您可以創建服務來存儲以后需要的值。 例如。 您可能有一個UserService。 當有人登錄時，將用戶對象保存到UserService，然后在需要獲取用戶對象的其他地方，調用UserService.getCurrentUser（）……不要嘗試在當前層次結構之外的某個范圍內查找它。

如果要編寫指令，則可能會創建一個隔離范圍。 因此，在您的指令中，將您可能需要的所有作用域值作為參數傳遞，並將它們放在獨立作用域中。

在極少數情況下，您將需要使用$ parent或$ rootScope，並且應避免在99.9999％的時間內使用它們。

Answer 3

或者..如果您想在應用程序中使用某些共享狀態/方法，則可以使用$ rootScope。

.controller('firstCtrl', function($rootScope){
    $rootScope.shared = 123;

})

.controller('secondCtrl', function($rootScope){
   console.log($rootScope)
})