ng-table分组 - 初始化行最小化

时间:2014-03-14 23:55:37

标签: angularjs ngtable

我正在使用来自http://plnkr.co/edit/CBcbkc

的ng-table的分组示例

现在,表已初始化,扩展了行,但我希望它们最小化,因为我有超过100条记录。我怎么能这样做?

3 个答案:

答案 0 :(得分:10)

您可以使用ngInitgroup.$hideRows设置为true:

<tbody ng-repeat="group in $groups" ng-init="group.$hideRows = true">

<强>更新
我想找到一个更好的解决方案,因为angular docs不鼓励使用ngInit来访问范围变量。

您可以为ng-repeat中创建的每个组创建一个控制器:

<tbody ng-repeat="group in $groups" ng-controller="groupCtrl">

然后,您可以直接访问组对象。这样做的一个优点是能够有条件地扩展一个群体:

.controller('groupCtrl', function($scope) {
  if ($scope.group.value != 'Administrator')
    $scope.group.$hideRows = true;
});

http://plnkr.co/gXfsBq

<强> FYI
我想知道为什么我在源代码中找不到对$hideRows的任何引用。事实证明,组对象在单击之后才具有$hideRows属性。为了证明这一点,我将$hideRows替换为一个名称,并且它的工作原理相同。

  <tbody ng-repeat="group in $groups">
    <tr class="ng-table-group">
      <td colspan="{{$columns.length}}">
        <a href="" ng-click="group.invokeInvisbility = !group.invokeInvisbility">
          <span class="glyphicon" ng-class="{ 'glyphicon-chevron-right': group.invokeInvisbility, 'glyphicon-chevron-down': !group.invokeInvisbility }"></span>
          <strong>{{ group.value }}</strong>
        </a>
      </td>
    </tr>
    <tr ng-hide="group.invokeInvisbility" ng-repeat="user in group.data">

难怪你找不到初始化它的方法。

答案 1 :(得分:3)

你可以告诉ngTable不要通过属性'groupOptions'展开它,见下文:

var table = new NgTableParams({ group: 'name' }, { dataset: users, groupOptions: { isExpanded: false } });

答案 2 :(得分:0)

只需在params部分中添加groupOptions: {isExpanded:false}

下面是带有适当附件的代码副本。

$scope.tableParams = new ngTableParams({
        page: 1,            // show first page
        count: 10,          // count per page
        groupOptions: {isExpanded:false}
    }, {
        groupBy: 'role',
        total: data.length,
        getData: function($defer, params) {
            var orderedData = params.sorting() ?
                    $filter('orderBy')(data, $scope.tableParams.orderBy()) :
                    data;

            $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
        }
    });