搜尋

首頁  >  問答  >  主體

angular.js - angular路由的控制器

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

javascript    .state('a', {
        ...
        controller : 'aaaController'
    })
    .state('b', {
        ...
        controller : 'aaaController'
    })

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

PHP中文网PHP中文网2783 天前822

全部回覆(3)我來回復

  • 伊谢尔伦

    伊谢尔伦2017-05-15 16:52:44

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

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

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

    部分controller代碼:

     .controller('MyCtrl', function ($scope, $log) {
            $scope.num = 2;
            $scope.change = function () {
                $scope.num = 3;
            };
    
            $scope.show = function () {
                $log.info($scope.num);
            };
        });
    

    先點選show按鈕,輸出結果如下:

    接著點選change to 3鈕,再點選show按鈕,結果如下:

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

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

    看控制台

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

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

    hope help you!

    回覆
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-15 16:52:44

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

    個人覺得正常的用法是:
    一個頁面,一個控制器
    如果是需要控制器之間共用變數和方法,可以透過在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

    回覆
    0
  • 伊谢尔伦

    伊谢尔伦2017-05-15 16:52:44

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

    回覆
    0
  • 取消回覆