Angular ui-router 中 $state.transitionTo() 和 $state.go() 之间的区别

Posted 2023-02-19

【中文标题】Angular ui-router 中 $state.transitionTo() 和 $state.go() 之间的区别

【英文标题】：Difference between $state.transitionTo() and $state.go() in Angular ui-router

【发布时间】：2014-02-02 00:56:41

【问题描述】：

在 AngularJS 中，我看到有时我们使用 $state.transitionTo()，有时我们使用 $state.go()。谁能告诉我它们有何不同以及何时应该使用一个而不是另一个？

【参考方案1】：

你指的是AngularUI Router吗？如果是这样，维基specifies the differences：

$state.go(to [, toParams] [, options])

返回一个表示转换状态的 Promise。

转换到新状态的便捷方法。 $state.go 在内部调用 $state.transitionTo，但会自动将选项设置为 location: true, inherit: true, relative: $state.$current, notify: true 。这使您可以轻松地使用绝对路径或相对路径，并仅指定您想要更新的参数（同时让未指定的参数从当前状态继承）。

---

$state.transitionTo(to, toParams [, options])

返回一个表示转换状态的 Promise。

转换到新状态的低级方法。 $state.go() 在内部使用 transitionTo。在大多数情况下建议使用$state.go()。

【讨论】：

我从您给定的链接中找到了我需要的更多信息。非常感谢布兰登 :)

显然，如果我使用 transitionTo 重新触发视图，则视图中输入的值不会刷新。无论如何我们可以强制刷新值/js/view？附言- 页面重新加载不是一个选项，因为视图是叠加层

【参考方案2】：

$state.transitionTo 转换到新状态。在大多数情况下，您不必使用它，您可能更喜欢$state.go。

它在options 对象中接受一些参数：

location：如果true 会更新地址栏中的url，如果false 不会。如果是字符串"replace"，将更新url并替换最后的历史记录。 inherit：如果true会从当前url继承url参数。 relative (stateObject, default null)：当使用相对路径（例如'^'）进行转换时，定义要相对于哪个状态。 notify：如果true，将广播$stateChangeStart和$stateChangeSuccess事件。 reload：如果 true 将强制转换，即使状态或参数没有改变，也就是重新加载相同的状态。

---

$state.go 是一种快捷方式，它使用默认选项调用$state.transitionTo：

location: true inherit: true relative: $state.$current notify: true reload: false

因为合成器更简单，所以更方便。您只能使用州名来调用它。

$state.go('home');