ui-router 无法在 Angular 应用程序中工作的问题

Question

我正在尝试让 URL 路由器为我的应用程序工作，但由于某种原因它不会链接文件。 我创建了一个简单的 plnkr 来演示这个问题......

有人可以帮忙吗

http://plnkr.co/edit/XQs2vP4vtqnBWGKqmJZz

谢谢

Answer 1

有一些误解：

1. 您没有指定要呈现为状态的 ui-view
2. 您将状态配置为命名视图，这仅在您需要多个并行 ui 视图时才有意义（始终可以嵌套视图）

如何解决

在您的视图中使用<div ui-view></div> 用于普通视图，并使用<div ui-view="content"></div> 用于命名视图（content 是您可以随意选择的自定义名称）。

此外，您可以使用ui-sref 属性链接到特定状态，这比手动设置href 更好。在下面的所有演示中，我都展示了两种方式。

请注意，普通视图具有更简单的状态定义语法：

.state('person', {
    url: '/persons',
    templateUrl: 'list1.html',
    controller: 'employeeCtrl'
})

演示

Demo with normal views（单视图）

Demo with named views（用于多视图）

在这两种情况下，您都可以嵌套视图作为对 ui-router 可能性的进一步探索（这使其优于默认角度路由）：

Demo with normal views and nesting

Demo with named views and nesting

无限可能。