给定一个HTML文件如下:
<html> <header ui-view="header"></header> <div class="main" ui-view></div> <footer ui-view="footer"></footer> </html>
如何创建一个布局状态,用头模板填充“头”,使用页脚模板填充页脚,然后允许子状态填充空的ui视图?
我认为空的ui视图也可以命名为像ui-view =“main”。
一种方式是创建一个全局“根”状态。所以,每一个国家都会是孩子。
像root.pages,root.pages.edit,root.settings等
然后您可以为页眉和页脚提供默认模板。
像root.pages,root.pages.edit,root.settings等
然后您可以为页眉和页脚提供默认模板。
另一种方式,不同的方法,我个人使用,是使用ng-include的页眉和页脚。
<body ng-controller="AppCtrl"> <div id="header" ng-include="'header.tpl.html'"></div> <div class="main_container" ui-view> </div> </body>
Btw。我在header.tpl.html中使用单独的控制器,这是主AppCtrl的子代:
<div id="header" ng-controller="HeaderCtrl"> ....