javascript - ngRepeat 无项目时处理

标签 javascript angularjs angularjs-directive angularjs-ng-repeat

我正在使用 ngRepeat 渲染表格行:

<tr ng-repeat="User in ReportModel.report" on-finish-render>
    <td><span>{{User.name}}</span></td>
</tr>

我有这个 on-finish-render 指令来发出一个事件,如果监听让我知道表格何时准备好:

app.directive('onFinishRender', function ($timeout) {
    return {
        restrict: 'A',
        link: function (scope, element, attr) {
            if (scope.$last === true) {
                $timeout(function () {
                    scope.$emit('ngRepeatFinished');
                });
            }
        }
    }
});

这就是在 Controller 中发出 ngRepeatFinished 事件时发生的情况:

$scope.$on('ngRepeatFinished', function(ngRepeatFinishedEvent) {
    //set a variable to true which datatables directive is watching
    //when that variable is true, initiate datatables
    $rootScope.ReportReady = true;
});

然后我有 DataTables 指令来查找报告何时准备好:

  scope.$watch(
    function() {
      return $rootScope.ReportReady
    },
    function(newValue, oldValue) {
      if (newValue) {
        var dTable = element.dataTable(scope.options);
        $rootScope.ReportVisible = true;
      }
    });

问题是有时报告中没有任何项目,因此不会发出事件并且数据表不会显示。

有什么建议吗?

最佳答案

使用 ng-show 或 ng-hide 根据 ReportModel.report 中是否有数据来显示或隐藏表。因此只需检查数据是否为空即可显示或隐藏。

关于javascript - ngRepeat 无项目时处理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34844329/

相关文章:

javascript - AngularJS 和 Firebase 教程 : 'TypeError: undefined is not a function;' issue

javascript - CSS:根据原始大小调整 Div 大小

javascript - 将 zip 文件返回到 angularjs 进行下载

javascript - 如果值是使用 angularJS 的数字,则应用过滤器

javascript - 如何从 ng-repeat 中删除这个 li 元素?

javascript - 需要 12 小时格式而不显示 AM/PM Timepicker

JavaScript:获取属性时检查对象是否为空或未定义

javascript - 为什么这些 CSS 文件被下载了两次?

javascript - jQuery.each 在可用时不依赖 Array.forEach 是有原因的吗?

javascript - 动态创建元素的 Angular ng-hide