Question

我正在构建一个由ng-repeat填充的表，该表遍历来自数据库的列表。这部分工作正常，但我希望有一个复选框，让用户选择删除哪些行。我还希望在表格标题上有一个复选框，作为全选按钮。

问题在于，据我所知，ng-repeat循环包含有关行内的所有内容，使我无法在循环和行尾之间插入手动单元格。

有没有办法在循环和行尾添加一个额外的单元格，例如使用ng-repeat-start和ng-repeat结束？

以下是我尝试的一个例子。显然，这个没有用。

<table>
    <tr><th ng-repeat=" e in poistoavaimet">{{e}}</th></tr>
    <tr ng-repeat="i in poistolista | filter:sukunimiVal | filter:etunimiVal">
        <td ng-repeat-start=" key in poistoavaimet">{{i[key]}}</td>
        <td ng-repeat-end>
            <input type="checkbox" ng-model="poistovalinta.{{$index}}"> 
          {{$index}}</input>
        </td>
    </tr>
</table>

poistoavaimet包含从数组中提取的键。 Poistolista是从中提取密钥的数组本身，它包含数据库中的数据。 Poistovalinta是复选框值的变量。 poistovalinta.{{$index}}试图在poistovalinta -array中创建一个条目，该条目具有该行索引的键。

我将添加一段代码片段，以便从控制器处理这些变量：

    $scope.haePoistettavat = function(){
            $http.get('/opiskelijahaku', {params: {'optio':2}})
              .then(function(res){
                    $scope.poistolista = res.data.message;
                    $scope.poistoavaimet = Object.keys($scope.poistolista[0]);
                    $scope.adminLista = {};
                    $scope.adminLista['poisto'] = true;
            }, function(error){
                    console.log(error)
            });
    }

此函数使用一个选项向服务器发送http get，该选项告诉服务器返回正确的列表。响应存储在$scope.poistolista中，密钥将被提取到数组$scope.poistoavaimet中。 $scope.adminLista包含链接到多个对象中的ng-show的true / false值。这个想法只是在当时展示其中一个。这与问题没有直接关系。

Answer 1

感谢@RaphaMex清除了我对ng-repeat的工作方式的误解！

解决方案正是他所说的。只需在重复后添加单元格即可。

这是固定版本：

            <table>
                    <tr><th ng-repeat=" e in poistoavaimet">{{e}}</th><th><input id="kaikki" type="checkbox" ng-model="kaikkiVal"></th></tr>
                    <tr ng-repeat="i in poistolista | filter:sukunimiVal | filter:etunimiVal">
                            <td ng-repeat=" key in poistoavaimet">{{i[key]}}</td>
                            <td><input type="checkbox" ng-model="poistovalinta"></td>
                    </tr>
            </table>

如何在ng-repeat之后在每个表格行中添加手动单元格？

1 个答案: