角UI路由器：$ stateParams我的指令內空

在我的角度應用程序，我已經創建了一個navbar自定義指令，該控制器發生在$stateParams訪問一個名爲lang變量，像這樣：

.config(function($stateProvider, $urlRouterProvider, LANG) { 

    $urlRouterProvider 
     .otherwise('/' + LANG['EN'].shortName); 

    $stateProvider 
     .state('proverb-list', { 
      url: '/:lang', 
      templateUrl: 'components/proverb-list/proverb-list.html', 
      controller: 'ProverbListCtrl as vm' 
     }) 
     .state('proverb-single', { 
      url: '/:lang/:proverbId', 
      templateUrl: 'components/proverb-single/proverb-single.html', 
      controller: 'ProverbCtrl as vm' 
     }); 
});

當我訪問proverb-list狀態時，名爲ProverbListCtrl的控制器確實看到$stateParams.lang，但我的導航欄指令不能。當我console.log($stateParams)所有我得到的是一個空的對象。

這NavBar是超出了我的ui-view：

<navbar proverbial-navbar></navbar> 

<div ui-view></div> 

<footer proverbial-footer></footer>

是什麼問題？我如何訪問我的指令中的實際$ stateParams？

編輯：指令下面的代碼，如問：

(function() { 
    'use strict'; 

    angular 
     .module('proverbial') 
     .directive('proverbialNavbar', directive); 

    function directive() { 
     var directive = { 
      restrict: 'EA', 
      templateUrl: 'components/shared/navbar/navbar.html', 
      scope: { 
      }, 
      link: linkFunc, 
      controller: Controller, 
      controllerAs: 'vm', 
      bindToController: true 
     }; 

     return directive; 

     function linkFunc(scope, el, attr, ctrl) { 

     } 
    } 

    Controller.$inject = ['LANG', 'ProverbFactory', '$stateParams']; 

    function Controller(LANG, ProverbFactory, $stateParams) { 
     var vm = this; 

     vm.languages = LANG; 
     console.log($stateParams); 
     vm.currentLang = LANG[$stateParams.lang.toUpperCase()]; 

     activate(); 

     function activate() { 
      vm.alphabet = ProverbFactory.getAlphabet(); 
     } 
    } 
})();

來源

2015-12-20 Tiago

請在指令中用'='符號將stateparams作爲值傳遞。您應該能夠以這種方式訪問指令中的示波器模型。因此，可能希望在將$ stateParams傳遞給指令之前將其分配給模型。請記住，在這些情況下，即使您有單獨的指示範圍，您也可能需要使用子女互動範圍/影子dom。因此，爲所有這些創建一個超級控制器。 Ui-router允許你指定多個視圖可能你可以使用那個 – Gary

是的，導航欄在UI視圖之外可能是問題。想想看。在你進入狀態之前，導航欄會被實例化一次。所以當導航欄代碼運行時，它還沒有進入狀態。顯示您的指令代碼以確認。 –

在該指令，則不應訪問$stateParams當它是獨立於政府的。由於您的導航欄不在ui-view之內，因此可以在ui-router初始化您感興趣的狀態的$stateParams之前調用其控制器。請記住，導航欄控制器僅在初始化時調用一次，而不是在每次狀態變化。

替代：你可以做的是把你的currentLang字段變成一個函數。在需要時該功能可檢索來自$stateParams值：

vm.currentLang = function() { return LANG[$stateParams.lang.toUpperCase()] };

確保你在你的模板改變currentLang到currentLang()無處不在。

來源

2015-12-20 17:01:59 lex82

角UI路由器：$ stateParams我的指令內空

回答

相關問題