我有一个到目前为止工作正常的ngGrid.但是,我想在没有给出任何项目时隐藏它,因此没有数据显示.
我试过的是:
<div class="gridStyle" ng-grid="gridOptions" ng-show="items.length > 0"> </div>
这有效,当items.length等于0时,它实际上隐藏了网格,但是一旦我将数据添加到items数组,网格就不会显示.
如果我将ng-show指令放到外部div中也没有区别:
<div ng-show="items.length > 0"> <div class="gridStyle" ng-grid="gridOptions"> </div> </div>
我知道我做错了什么?
负责的控制器看起来像这样:
(function (root) { 'use strict'; root.app.controller('listItemsController',[ '$scope','myService',function ($scope,myService) { $scope.items = []; $scope.gridOptions = { columnDefs: [ { field: 'id',displayName: 'Id' },{ field: 'type',displayName: 'Type' },{ field: 'value',displayName: 'Value' } ],data: 'items',enableRowSelection: false }; $scope.$on('navigation::selectedItem',function (evt,selectedItem) { myService.getItems(selectedItem,function (err,items) { $scope.items = items; }); }); } ]); })(window);
让项目完美运行,并在网格上设置它们也能完美地工作 – 如果我省略了ng-show指令.
UPDATE
好的,它似乎是初始渲染的问题.与开始时一样,没有项目,CSS显示属性设置为none.显然这可以避免正确的渲染.如果你通过使用覆盖它
ng-hide: { display:block!important; }
在你的风格中,一切都按预期工作(当然,除了网格被隐藏).
解决方法
我用ng-if而不是ng-show解决了它.