ng-repeat 的空列表消息总是闪烁？答案

【问题标题】：The message for empty list for ng-repeat always flash?ng-repeat 的空列表消息总是闪烁？
【发布时间】：2017-01-28 08:46:22
【问题描述】：

以下来自 ionic 项目的代码假设在 events 为空时显示消息“无记录”。但是，即使events 不为空，消息总是显示半秒钟然后消失？如何摆脱闪光灯？

<a ng-repeat="event in events">
  ....
</a>
<div ng-hide="events.length"> <!-- <div ng-show="!events.length"> behaves the same -->
  <div ....>
  No record.
  </div>
<div>

更新： 创建了一个可测试的plunkerhttps://plnkr.co/edit/lchTKN6C8niAsALquHoF?p=preview，即使列表不为空，你可以看到红色消息仍然闪烁？

【问题讨论】：

ng-cloak 旨在与 css 一起使用，以在 angular bootrstraps 或初始编译时隐藏元素。请参阅文档

标签： angularjs ionic-framework

【解决方案1】：

试试ng-cloak 和ng-hide/ng-show

<div ng-hide="events.length" ng-cloak> <!-- <div ng-show="!events.length"> behaves the same -->
  No record.
<div>

ngCloak 指令用于防止 Angular html 模板在您的应用程序加载时被浏览器以原始（未编译）形式短暂显示。使用该指令可以避免 html 模板显示引起的不良闪烁效果。

Documentation 用于 ng-cloak

更新：

由于$scope.events 数组在服务返回完成之前被初始化为空值。约定是使用$promise 对象在延迟任务完成时访问它的结果。

var allEvents = EventService.query({ category: "Music" });

allEvents.$promise.then(function (response) {
    $scope.events = response;
});

Demo of working plunk

【讨论】：

刚用模拟器试了下，好像没有解决问题？
可能是两件事，首先 - 将其更改为 ng-show="events.length == 0" ng-cloak ，其次您是否在加载事件之前在控制器中的某处定义了 $scope.events = [ ]。
我做了两个更改，但仍然没有运气。控制器现在是.controller('AAACtrl', function ($scope, EventService) { $scope.events = []; $scope.events = EventService.query({ category: "AAA" }); })。
我的意思是删除这个$scope.events = [];如果你在控制器中定义了这个。
不，它不存在，但仍然存在问题。