保持外部视图不变，而只是在 angular-ui 中重新加载内部视图

Question

我有几个类似这样的模板：

home.html

<div ui-view></div>   <!-- homeframe.html plugs in here -->

homeframe.html

<!-- quickcontact.html and settings.html plugs in here -->
<div ui-view="widget"></div>

<a class="link" ng-click="changeUrl('/')">quickcontact</a>
<a class="link" ng-click="changeUrl('/settings')">settings</a>

quickcontact.html

<div>
.
.
.
</div>

settings.html

<div>
.
.
.
</div>

homeframe.html 加载到出现在home.html 中的ui-view 中。同样，quickcontact.html 和 settings.html 在 widget ui-view 中加载。我想阻止homeframe.html 再次重新加载，而只是不断更改widget ui-view 的内容。如何使用 angular-ui 状态实现这一点？

Answer 1

尝试直接导航到您的快速联系人或设置状态，而不是更改 URL 来触发它们。您可以使用 ui-router 的 ui-sref 指令来触发状态转换。假设状态被命名为settings 和quickcontact：

<a class="link" ui-sref="quickcontact">quickcontact</a>
<a class="link" ui-sref="settings">settings</a>