ng-hide元素出现一会就隐藏？

Question

<div class="alert alert-warning" ng-hide="badges.length">      
    <strong>Empty!</strong> This Micro_organization has No badges.
</div>
<ul> 
  <li ng-repeat="badge in badges">{{ badge.title }}</li>
</ul>

即使徽章不为空，消息 Empty! This Micro_organization has No badges. 也会出现一段时间。

是否有任何解决方案使消息仅在徽章为空时显示？

Answer 1

如果您使用 ajax 请求获取数据，那么 badges 将 undefined 直到 ajax 调用 return 数据。

直到接收到的数据 badges.length 将保持 undefined 然后 ng-hide="badges.length" 将导致某些结果 ng-hide="false" 这可能是部分出现 [=34= 的情况]

--解决方案--

如果您在获取 resource 数据之前声明了 $scope.badge，请删除该声明。仅在 resource 调用之后声明 $scope.badge。并使用

 <div class="alert alert-warning" ng-hide="badges.length != 0">..

Plunker

Answer 2

在加载badges之前，变量未定义。您可以通过更改 ng-hide 表达式以确保 badges 存在来解决此问题。

ng-hide="!badges || badges.length"

ng-hide元素出现一会就隐藏？

The ng-hide element appears for a while and then hide?

javascript

angularjs

ng-hide