背景：
对于一个网站来说，即便是做一个静态页面，我们希望的一种理想的方式是：可以实现页面的组合， 只要是相同的页面元素，比如： header 和 footer， 都应该“复用”。 基于node.js的MEAN 全栈框架中，我们通过 AngularJS的
ng-include实现"复用"。
ng-include 指令
在 AngularJS中，有一个 ng-include 指令。 与此相关的是 ng-view 指令。简单说下它们的应用场景：
ng-view 通过前端路由来控制，通过ng-view，可以方便地实现页面的组合，但它也有一个明显的不足，就是一个 html 文件中，只能有一个`ng-view。
而ng-include就是将多个页面的公共页面提取出来，比如： header.html、 footer.html 等。每个页面用 ng-include 中引入进来。
ng-include 应用场景
创建一个 express 工程， 在 partials目录下，创建 footer.html 文件。 如下：
express工程的 footer.html 文件
代码示意：
<footer class="footer ">
....
</footer>
在 views 目录下的 index.ejs 文件中添加代码
index.ejs
<body >
<div ng-view> </div>
<div ng-include="'partials/footer.html'" > </div>
</body>
这里要特别注意 ng-include 引用的语法：
最外层是一对双引号，里面是一对单引号。
小结
在同一个 html文件中无法嵌套两个 ng-view，这个ng-route的痛点。既然痛点存在，AngularJS UI Team 早已有了替代方案，它就是 ui-router 的应用。
网友评论