ui-router 在状态改变之前渲染模板答案

【问题标题】：ui-router renders template before state changesui-router 在状态改变之前渲染模板
【发布时间】：2014-12-15 14:23:47
【问题描述】：

我有一个这样的嵌套状态结构：

$stateProvider
        .state('main', {
            url: '',
            abstract: true,
            templateUrl: ...
            controller: mainController,
            resolve: {
                Resolve1: ...
                Resolve2: ...
            }
        })
        .state('main.state1', {
            url: '^/state1/:id/',
            templateUrl: ....
            controller: state1Controller,
            resolve: {
                Resolve11: ...
                Resolve22: ...
            },
        })
        .state('main.state2', {
        ....

据我所见，当您处于状态 main.state1 并使用另一个 id 参数导航到同一状态时，main.state1 的模板渲染得很好，但 main 的模板（父) 在状态改变之前渲染（我猜它不会等待main.state1 的数据解析）。这会导致使用错误数据呈现视图（更具体地说，我用于生成链接的状态参数是错误的）。

我的mainController 注入了$stateParams 和$state，这就是我从中获取数据的地方。

以前有人注意到这个吗？这是设计使然还是错误？

有没有办法用最新的数据更新父视图？

但是，我希望 ui-router 等待所有数据解析，直到它开始呈现视图（甚至是父视图）。我不知道我是否在这里遗漏了什么，但这是我迄今为止对问题的理解......

更新：

我现在看到，视图渲染（带有插值）中涉及的函数被多次调用，首先使用旧值，然后使用新值。但我在屏幕上看到的最终结果是使用我第一次进入“main.*”状态时使用的初始数据。这太奇怪了。

更新 2：

我发现我的链接只有在使用 ui-sref 时才更新（请注意，我在状态 href 中使用了参数，例如 ui-sref="main.state1({id:{{getId()}} })")。当切换到 ng-href 时，一切都按预期工作。

我不知道为什么，但这解决了问题。

奇怪的是，ui-sref 被评估了，但链接没有更新。

去看看……

更新 3：

这个解决方案又导致了其他问题。然后第一次点击重新加载了应用程序...所以这不是最好的解决方法...

【问题讨论】：

标签： angularjs angular-ui-router

【解决方案1】：

“解决方案”是使用ng-click 和$state.go()，而不是链接。

这似乎是 ui-router 中的一个错误。

【讨论】：

【解决方案2】：

ui-router 将“通过”父状态转换为子状态。这意味着将触发 main，然后触发 main.state1。我自己遇到了这个问题，我得到了重复的侦听器和 HTML DOM 元素 - main 实际上与 main.state1 在同一时间运行。这种行为是设计使然，AFAIK 您唯一的选择就是围绕它进行设计。

【讨论】：