在加载某些特定页面时隐藏页眉和页脚
在加载某些特定页面时隐藏页眉和页脚
提问于 2018-06-27 20:18:18
Angular 1.x应用程序:如何隐藏应用程序中某些特定页面上的页眉和页脚？我在状态上设置了一个'navigateOut‘数据属性，并使用ng-if根据该属性值显示\隐藏元素(如页眉和页脚)。问题是，当页面加载时，状态还没有设置，所以我可以在几秒钟内看到元素。
.state('signup', {
url: '/signup',
template: require('partials/sso.html'),
controller: 'SignupController as signup',
data: {
navigateOut: false
}
})
<app-footer ng-if="$state.current.data.navigateOut !== false"></app-footer>回答 2
Stack Overflow用户
发布于 2018-06-27 20:37:56
尝试在包含它的div标记中给出ng-if条件，而不是像下面这样的app-footer标记
<div ng-if="$state.current.data.navigateOut !== false">
<app-footer ></app-footer>
</div>或者使用带有“隐藏”类名的ng-class来隐藏元素，而不是使用ng-if或ng-show/ng-hide。
Stack Overflow用户
发布于 2018-06-27 20:47:55
我能想到的一种方法是为页眉和页脚创建一个单独的模板和控制器。在页眉、页脚和内容下命名多个ui视图。对于每个状态，您只需加载所需的组件。
如果问题仍然存在，可能是由于默认情况下启用的ng-animate库造成的。尝试禁用它
<div ui-view="header"></div>
<div ui-view="content"><!-- Content --></div>
<div ui-view="footer"></div>
$stateProvider
.state('myapp', {
views: {
'header': {
template:'header.html',
controller:'HeaderController'
},
'content': {
template:'content.html'
},
'footer': {
template:'footer.html',
controller:'FooterController'
}
}
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51062597
复制相关文章
相似问题
腾讯云开发者
