Question

我的AngularJS模板中有两个并行视图。一个是主页面视图，第二个是导航栏视图。如果用户已登录，我会在主视图中显示私人数据，并在导航视图中显示指向用户帐户的链接。如果用户未登录，我会显示欢迎屏幕和登录链接。所以，这就是我使用两个平行视图的原因。

在模板中使用ui-router和一个ui-view指令时，事情按预期工作。在我的模板中使用两个名为ui-view的指令时，$state.go('nameOfState')不再有效。

这是一个Plunk，它在$state.go()触发状态时失败，因为它有两个视图。这是一个Plunk，它显示了只有一个视图时相同代码的工作方式。

为什么$state.go()无效？

Answer 1

问题是您的家庭状态的控制器没有被实例化，这意味着$state.go调用永远不会发生。控制器仅在需要时实例化。具体而言，文档states：

警告：如果未定义模板，则不会实例化控制器。

为了实例化mainCtrl，您可以将模板添加到home状态，并将未命名的ui-view添加到index.html，或者您可以为其中一个添加模板或更多home状态的现有命名视图（例如“main”），并将mainCtrl移动为这些视图的控制器。例如。如果用以下内容替换现有的家庭状态，它应该按预期工作：

.state('home', {
    url: '/',
    views: { 
      'main': {
        template: 'main template',
        controller: mainCtrl
      }
    }
  })

当使用“views”属性时，AngularJS ui-router $ state.go（）不会触发状态

1 个答案: