angular.js - angular路由的控制器

Question

路由時兩個頁面能公用一個控制器嗎，例如

<code>javascript</code><code>    .state('a', {
        ...
        controller : 'aaaController'
    })
    .state('b', {
        ...
        controller : 'aaaController'
    })
</code>

如果行的話，控制器是獨立的作用域還是公用的，比如說我在控制器裡聲明了個變數i，在a頁面中改變了i的值，當我路由到b頁時，i的值會跟著變嗎

Answer 1

最近也在學習angularjs，就樓主所說的問題，可以做一個簡單的示範：

有如下的html結構，不同的view，相同的conroller

<code><p ng-controller="MyCtrl">
    <button ng-click="change()">change to 3</button>
</p>
<p ng-controller="MyCtrl">
    <button ng-click="show()">show</button>
</p>
</code>

部分controller代碼：

<code> .controller('MyCtrl', function ($scope, $log) {
        $scope.num = 2;
        $scope.change = function () {
            $scope.num = 3;
        };

        $scope.show = function () {
            $log.info($scope.num);
        };
    });
</code>

先點選show按鈕，輸出結果如下：

接著點選change to 3鈕，再點選show按鈕，結果如下：

從這個實驗可以看出，雖然是同一個controller，但實際上scope是兩個完全不相干的scope。
scope的結構也是樹狀的，同dom結構對應，如上的html結構就會有兩個scope。
再看一個明顯的例子：

<code> .controller('MyCtrl', function ($scope, $log) {
        $log.info('init scope...');
    });
</code>

看控制台

結果列印了兩遍，說明方法執行了兩次。如果共享scope就不會執行兩次了。

綜上：你在控制器裡聲明了個變數i，在a頁面中改變了i的值，當你路由到b頁時，i的值不會改變

hope help you！

Answer 2

這樣子使用比較奇怪，不太確定這樣使用是否可行

個人覺得正常的用法是：
一個頁面，一個控制器
如果是需要控制器之間共用變數和方法，可以透過在angular裡建立一個service存放變數和方法，在不同的controller裡面，注入我們寫的service就可以了

官方文件裡也有明確說明service是用來share code的：
Services
Angular services are substitutable objects that are wired together using dependency injection (DI). You can use services to organize and share code across your app.

https://docs.angularjs.org/guide/services

Answer 3

切換路由後控制器的生命週期就結束了，目前的$scope及子作用域就都死了。
如果需要在多個控制器之間共享數據，可以使用服務。