Question

尝试确定如何利用Angular的工具集来解决我正在尝试解决的问题。

我的应用程序将是一个单页应用程序，但它也只有一个路由。 URL状态中根本没有其他“状态”。据我所知，您可以利用路径的1：1关系控制器和视图。

我想要的是在页面上为组件设置Controller + View组合。（组件可以是小部件，模态窗口等）。

在这种情况下，有没有办法利用Angular？

注意：我看过https://github.com/angular-ui/ui-router，但这仍然严重依赖于创建应用程序的“状态”并将其绑定到URL。

Answer 1

要包含HTML部分，您可以使用ng-include指令。这可以通过几种不同的方式与ng-controller指令结合使用：

您可以将ng-include内的元素嵌套在ng-controller：

中

<div ng-controller="testCtrl">
  <div ng-include="'view.html'"></div>
</div>

您可以在包含的部分中包含ng-controller指令：

<!-- index.html -->
<div ng-include="'view.html'"></div>

<!-- view.html -->
<div ng-controller="testCtrl">
  <p>{{ helloworld }}</p>
</div>

您还可以在同一元素上组合ng-include和ng-controller指令：

<div ng-controller="testCtrl" ng-include="'view.html'"></div>

请注意，在上面的每个示例中，ng-include指令中的字符串文字都用单引号括起来 - 这是因为该指令需要表达式。

根据您要完成的任务，您可能需要使用其中一种或多种技术。我还希望你需要大量使用指令（例如，你可以使用UI Bootstrap modal），它也可以拥有自己的控制器。

我设置了一个Plunker here，其中包含几个上面列出的ng-include选项的工作示例，包括动态交换包含的模板。

我不能说实际构建这样的生产应用程序的可行性，但它似乎是可能的，至少在第一眼就可以了。