我在我的 Angular 应用程序中定义了一个错误横幅,它应该仅在触发错误事件时可见,并且应该在页面加载时隐藏。
这是我的 Jade 代码:
div.container.content(ng-init='root.error.show = false')
div.col-md-12.error-container.ng-cloak(ng-show='root.error.show')
div.alert.alert-danger.alert-dismissible(role='alert')
button.close(type='button')
span(aria-hidden='true', ng-click='root.error.show = !root.error.show') ×
span.sr-only Close
p {{ root.error.message }}
我的 Controller
exports.RootCtrl = function RootCtrl($scope, $log) {
var self = this;
this.error = {
show: false,
message: 'Oups, something wrong just happend'
}
$scope.$on('error', function(event, data) {
self.error.show = true;
self.error.message = data;
})
}
我的问题是在加载 Angular 时,横幅显示为 {{ root.error.message }}
作为错误消息。
我尝试使用 ng-cloak (body(ng-cloak))
和 ng-init
来隐藏它,但它不起作用。
我相信我可以调整 css 以使用显示属性,但这会非常困惑。
解决此问题的常见最佳做法是什么?
最佳答案
根据 AngularJS 网站 (https://docs.angularjs.org/api/ng/directive/ngCloak),解决方案是以下 CSS:
[ng\:cloak], [ng-cloak], .ng-cloak {
display: none !important;
}
关于javascript - 如何在 Angular js 中加载时隐藏元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26214142/