Angularjs 角度ui路由器：$stateparms在我的指令中为空

在我的angular应用程序中，我为

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'
        });
});

当我访问状态

谚语列表

时，名为

谚语列表Ctrl

的控制器确实正确地看到了

$stateParams.lang

，但我的navbar指令不能。当我

console.log（$stateParams）

时，我得到的只是一个空对象

此导航栏位于我的

ui视图之外

：

<navbar proverbial-navbar></navbar>

<div ui-view></div>

<footer proverbial-footer></footer>

---

如果此指令独立于状态，则不应访问该指令中的

$stateParams

。由于您的导航栏位于

ui视图

之外，因此可以在

ui路由器

初始化您感兴趣的状态的

$stateParams

之前调用其控制器。请记住，仅在初始化导航栏时调用一次导航栏控制器，而不是每次状态更改时

备选方案：您可以将

currentLang

字段转换为函数。需要时，该函数可以从

$stateParams

中检索值：

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

---

确保将模板中的所有位置都更改为

currentLang

。

请将stateparms作为值传递给指令中的

=

签名。您应该能够以这种方式访问指令中的范围模型。因此，您可能希望在将$stateparms传递给指令之前将其分配给模型。请记住，在这些情况下，您可能需要子interitance scope/shadow dom，即使您有独立的指令作用域。因此，为所有这些创建一个超级控制器。Ui路由器允许您指定多个视图，您可以利用它是的，导航栏在Ui视图之外可能是问题所在。想想看。导航栏将被实例化一次，甚至在您进入状态之前。所以当导航条码运行时，它还没有进入状态。显示您的指令代码以进行确认。

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