AngularJS-处理重复的片段，例如页眉和页脚

AngularJS-处理重复的片段，例如页眉和页脚

按照ivarni的建议，在页眉/页脚中使用控制器。我自己的（实验性）应用的示例：

在index.html中，标题将显示动态生成的菜单，登录/注销等：

<div id="navbar"     x-ng-controller="NavbarCtrl" x-ng-include="'app/main/navbar.html'"></div>

在

NavbarCtrl

建立了适当的范围

app/main/navbar.html

模板。该模板如下（考虑到您的需求-并删除了无关的详细信息）：

<div  x-ng-if="showHeader">    <div >        <div> <ul >     <li x-ng-repeat="menuEntry in menuEntries">         <a x-ng-href="#{{menuEntry.path}}">{{menuEntry.display}}</a>     </li> </ul>        </div>    </div>    <div x-ng-if="userData.loggedIn">        Wellcome {{userData.userName}}!        <a x-ng-click="logout()">Logout</a>    </div>    <div x-ng-if="!userData.loggedIn">        <a x-ng-click="login()">Login</a>    </div></div>

因此，根据

showHeader

范围变量，整个标记都是隐藏的。它动态创建菜单（

menuEntries

）。并取决于

userData.loggedIn

适当的“登录/注销”消息。