Question

好的，我对angular和ui-router有相当多的经验，但是当涉及到我的app的架构时，我遇到了一个问题。我有一些州：

main.module.js

.state('main', {
    abstract: true,
    controller: 'MainCtrl',
    template: '<div ui-view />'
}).state('main.clients', {
    url: '/clients/:id',
    views: {
        list: {controller: 'ClientListCtrl', templateUrl: 'client-list.html'},
        detail: {controller: 'ClientDetailCtrl', templateUrl: 'client-detail.html'}
    }
}.state('main.services', {
    url: '/services/:id',
    views: {
        list: {...},
        detail: {...}
    }
}

main.html中

<div>
    <div ui-view='list'></div>
    <div ui-view='detail'></div>
</div>

客户list.html

<ul>
    <li data-ng-click='$state.go('main.clients({id: client.id})' 
        data-ng-repeat='client in clients'>
        {{client.name}}
    </li>
</ul>

这一切似乎都运行良好，并且视图填充正如我所期望的那样。我的主要问题是，当我处于main.clients状态且用户点击客户端名称时，$state.go(...)会触发，它会重新初始化ClientListCtrl和ClientDetailCtrl ，即使状态实际上没有改变（好吧，网址的:id部分也是如此）。

我滥用多个观点了吗？建筑的变化是否可取？只是试图以最有效的方式围绕如何构造它，并且在这种情况下控制器重新初始化似乎不是必要的，但我可能错过了一些东西。谢谢！

Answer 1

在99％的情况下，重新加载状态或其参数更改是我们想要的（我会说）。新的参数意味着不同的列表/细节。

但有一个设定：

reloadOnSearch

布尔 （默认为true） 。如果false因为搜索/查询参数已更改而不会重新触发相同的状态。当您想要修改$ location.search（）而不触发重新加载时很有用。

我创建了an example here，展示了如何在搜索时关闭重新加载。

状态更改会触发重新加载，
params更改不

片段：

  .state('index', {
      url: '/index/:area',
      ...
    })
    .state('index.detail', {
      url: '/detail/:id',
      reloadOnSearch : false,
      ...

会说，即使使用解析器，默认行为也是我们所需要的。但是......检查行动中的变化here

具有多个视图的角度ui-router状态＆amp;控制器实例化

1 个答案:

reloadOnSearch