尝试确定如何利用 Angular 的工具集来解决我要解决的问题。
我的应用程序将是一个单页应用程序,但它也只有一个路由。根本没有 URL 状态中的其他“状态”。据我所知,您可以在与路由的 1:1 关系中利用 Controller 和 View 。
我希望页面上的组件具有 Controller+View 组合。 (组件可以是小部件、模态窗口等)。
在这种情况下有什么方法可以利用 Angular 吗?
注:我看过https://github.com/angular-ui/ui-router ,但这仍然在很大程度上依赖于创建应用程序的“状态”并将其绑定(bind)到 URL。
最佳答案
要包含 HTML 部分,您可以使用 ng-include
指令。这可以通过几种不同的方式与 ng-controller
指令相结合:
您可以在 ng-controller
中使用 ng-include
嵌套元素:
<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 ),它们也可以有自己的 Controller 。
我设置了一个 Plunker here使用上面列出的 ng-include
选项的几个工作示例,包括动态交换包含的模板。
我不能说实际构建这样的生产应用程序的可行性,但它似乎是可能的,至少乍一看是这样。
关于javascript - AngularJS:单路由应用架构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24521320/