如何实现AngularJS子视图页面路由概念？

Question

我对路由有疑问。我已经在问题的第一个回复中附加了示例Image，我希望实现哪些功能。

我有一个带有ng-view标签的单页应用。在ng-view下，我有3个链接:: Link1，Link2和Link3。单击每个链接应仅在ng-view下显示屏幕右侧的结果。我也想更改我的网址，例如：websitename/home/link1，websitename/home/link2，websitename/home/link3，基于默认网址websitename/home。我不想在更改链接时刷新左侧面板。

如何使用AngularJS实现此功能？我应该使用ngInclude / ngDirectives / ngview / ngSwitch吗？我完全无能为力。从在线教程中，我了解到我不应该为同一个应用程序使用多个ng-view标签。这是真的吗？

此外，我无法将ng-view移动到右侧面板，因为在我的标题中有很多页面导航。这种观点就是其中之一。

Answer 1

您必须为父网址创建子网址，然后访问该子网址，以便该子网址的视图可以在父网址的视图下呈现。 为此，您可以使用ui.router模块。 例如：

$ stateProvider.state（{    name：＆＃34; parent-view＆＃34;，    url：＆＃34; / parentView＆＃34;，    templateUrl：＆＃34; templates / parentView.html＆＃34; }）;

$ stateProvider.state（{    name：＆＃34; parent-child-view＆＃34;，    url：＆＃34; / childView＆＃34;，    templateUrl：＆＃34; templates / childView.html＆＃34;，    父母：＆＃34;父母观点＆＃34; }）;

现在从控制器你必须调用$ state.transitionTo（＆＃34; parent-child-view＆＃34;）;