Javascript 如何避免AngularJS ui网格在加载api时显示“无数据”消息

我有angularjs ui网格，我使用下面的条件检查数据的可用性，这意味着如果数据不存在，我将显示“无可用数据”消息。 问题是我的api调用有点慢，因为有大量的数据，所以当这个调用过程中没有可用的数据显示时，我首先需要以角度的方式隐藏它。最初我不能使用disply:none，因为网格过滤器中有太多的条件，在这些条件之后，该消息将不得不显示，所以每次我都不能说disaply:none和display:block。任何帮助都会很有帮助的，谢谢

html

---

请参阅下面的演示

使用另一个状态处理程序变量（例如$scope.loading）轻松操作：

一,

---

2包括一点超时

在控制器中添加一个新变量：

$scope.noData = false;

将api调用更改为：

$http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500.json')
    .success(function(data) {
      if (data.length > 0) {
        $scope.gridOptions.data = data;
      } else {
        $scope.noData = true;
      }
    });

在视图更改中：

 <div class="watermark" ng-show="noData">No data available</div>

---

当选择过滤器时，网格中会有过滤器有时grid.data.length也会为0，在这种情况下它不会工作ID你是说过滤器中的隐藏列选项吗？是的，我要为表中的每一列选择过滤器，当用户单击列中的任何选项时，如果数据不存在，我必须显示消息，顺便说一句，您的代码在加载时仍然显示没有可用数据，请尝试停止并在plunker中运行，您将看到。您好，感谢您的回复，但这也不起作用，这两条消息都被交叉了，如果我应用的话，它将不起作用。在plnkr中没有交叉，也没有过滤器。我不明白。它就像一个符咒。请创建一个plnkr来重现您的问题。

$scope.loading = true;

$http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json').success(function(data) {
    $scope.loading = false;
    data = {"data": []};
    $scope.gridOptions.data = data;
});

$scope.noData = false;

$http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500.json')
    .success(function(data) {
      if (data.length > 0) {
        $scope.gridOptions.data = data;
      } else {
        $scope.noData = true;
      }
    });

 <div class="watermark" ng-show="noData">No data available</div>