Question

我希望有一个由3列组成的表，代码如下所示

    <table class="table-striped table-bordered table-condensed">
    <tbody>

    <tr ng-if="$index%3==0" ng-repeat="permission in vm.parent.getAllPermissions(category)">
    <td ng-repeat="i in [0,1,2]" class="col-xs-2">

    <span>

    <input type="checkbox" checklist-model="vm.data.permissions" checklist-value="vm.parent.getPermission(category,$parent.$index+i)">                              {{vm.parent.getPermissionTitle(category,$parent.$index+i) || " "}}

</span> 
</td> 
</tr>
</tbody>
</table>

除了一个小问题外，它的效果很好。

根本没有足够的json数据来填充3行，因此2个复选框显示为空

我尝试过，写的是

vm.hasPermission = function(category, index) {
    var permissions = vm.getAllPermissions(category);
    return permissions && index < permissions.length
};

然后像

    <span>
    <input ng-if="vm.parent.hasPermission(category,$parent.$index+i)"type="checkbox"
 checklist-model="vm.data.permissions" checklist-
value="vm.parent.getPermission(category,$parent.$index+i)">                                                      {{vm.parent.getPermissionTitle(category,$parent.$index+i) || " "}}
    </span>

它修复了问题，但没有修复所有表，某些表仍然会有空的复选框。

我获得了这样的许可标题

vm.getPermissionTitle = function(category, index) {
    var permissions = vm.getAllPermissions(category);   
    if (index < permissions.length) {
     return i18n.get(permissions[index]);
    } else {
     return '';
    }
};

我尝试删除了返回，没有修复它。

Answer 1

变化：

<td ng-repeat="i in [0,1,2]" class="col-xs-2">
    <span>
        <input type="checkbox" checklist-model="vm.data.permissions" checklist-value="vm.parent.getPermission(category,$parent.$index+i)">                              {{vm.parent.getPermissionTitle(category,$parent.$index+i) || " "}}
    </span> 
</td>

有：

<td ng-repeat="i in [0,1,2]" class="col-xs-2">
    <span ng-if="vm.parent.getPermissionTitle(category,$parent.$index+i)!=''">
        <input type="checkbox" checklist-model="vm.data.permissions" checklist-value="vm.parent.getPermission(category,$parent.$index+i)">                              {{vm.parent.getPermissionTitle(category,$parent.$index+i)}}
    </span> 
</td>

如果我很清楚你的代码和你的问题，vm.parent.getPermission(category,$parent.$index+i)会返回文本（权限），所以只检查它是不是空的......它也可能像：

<td ng-repeat="i in [0,1,2]" class="col-xs-2">
    <span ng-if="vm.parent.getPermissionTitle(category,$parent.$index+i)">
        <input type="checkbox" checklist-model="vm.data.permissions" checklist-value="vm.parent.getPermission(category,$parent.$index+i)">                              {{vm.parent.getPermissionTitle(category,$parent.$index+i)}}
    </span> 
</td>

因为vm.parent.getPermission(category,$parent.$index+i)没有返回任何内容可以评估为false。

我没有尝试过。

Answer 2

解决方案是

<table class="table-striped table-bordered table-condensed">
<tbody>
    <tr ng-if="$index%3==0" ng-repeat="permission in vm.parent.getAllPermissions(category)">
        <td ng-repeat="i in [0,1,2]" class="col-xs-2">
            <span ng-if="vm.parent.getPermission(category,$parent.$index+i)">
                <input type="checkbox" checklist-model="vm.data.permissions" checklist- value="vm.parent.getPermission(category,$parent.$parent.$index+i)">
    {{vm.parent.getPermissionTitle(category,$parent.$parent.$index+i)}}
</span>
</td>
</tr>
</tbody>
</table>

基本上{{vm.parent.getPermissionTitle(category,$parent.$parent.$index+i)}}

如果数据存在，则在angularjs中显示表行

2 个答案: