我有一个 json，在这个 json 中有一个我想在 <td> 中迭代的数组. 我的功能就像我必须根据用户输入创建一个表。用户提供行数、输入列和输出列的输入。所以我有三个数组，即 $rootScope.input_columns、$rootScope.output_columns 和 $rootScope.rows，它们包含用户提供的用于创建表的数据。现在在 input_columns 中有一个数组，其中包含一些我需要在行单元格上显示的信息。但是对于我当前的代码，它给了我空白行。

Controller :

var app = angular.module('rulesApp');

app.controller('myController2', ['$scope', '$rootScope',function($scope, $rootScope){
var inputcol=[];
            $rootScope.input_col=$scope.no_of_input;
            $rootScope.output_col=$scope.no_of_output;
            $rootScope.rows=$scope.no_of_row;
            for(var i=0;i<$rootScope.input_col;i++){
                inputcol.push({
                    id: inputcol.length,
                    dropped: false,
                    dataType:'',
                    name:'',
                    type:'input',
                    path:'',
                    rowCellValue:[],
                    rowCellValueOutput:[]
                });
            }$rootScope.input_columns=inputcol;//here i get input_columns json, Similarly json are made for output_columns and rows
            $scope.statementSelected = function(branch, selected_branches) {
        if(branch.selected) {
            for(var i = 0; i < $rootScope.input_columns.length; i++) {  
//Here i add an array inside input_columns.rowCellValue     $rootScope.input_columns[i].rowCellValue.push($rootScope.rows[i].rowCellValue);
                    }
})

添加input_columns的结构

这是我的 html 代码:

<tbody>
    <tr ng-repeat="row in rows"><!--It iterates on row json -->
        <td><input type="checkbox"></td>
        <!--Here i want that in row cells input_columns.rowCellValue data gets populate on row cell for input column -->
        <td ng-repeat="col in input_columns.rowCellValue">{{(col == "") && "&lt;enter data&gt;" || (col.split("/")[3])}}</td>
        <!--Here i want that in row cells output_columns.rowCellValueOutput data gets populate on row cell for output column -->
        <td ng-repeat="col in output_columns.rowCellValueOutput" ng-click="openDialog($event)">{{(col == "") && "&lt;enter data&gt;" || (col.split("/")[3])}}</td>              
    </tr>
</tbody>

我想得到这样的结构

但是我得到的是空白行

请任何人帮助我完成这项任务。有没有我没有迭代 input_columns 的问题，所以我没有得到 input_columns.rowCellValue 值。如何获取表列中 input_columns.rowCellValue 的值？无论如何我可以使用两个 ng 重复，第一个 ng-repeat 我可以获得 input_column 值 [input_column 中的 col]，第二个 ng-repeat 我可以获得 rowCellValue [cell in col.rowCellValue]。？

我尝试了一些解决方案并找到了一种访问 rowCellValue 的方法:

这是修改后的html代码

<tbody>
        <tr ng-repeat="row in rows"><!--It iterates on row json -->
            <td><input type="checkbox"></td>
            <!--Here i want that in row cells input_columns.rowCellValue data gets populate on row cell for input column -->
<!--here with $index i am getting first value of rowCellValue in entire column can i iterate it with using rows length -->
            <td ng-repeat="col in input_columns">{{(col.rowCellValue[$index] == "") && "&lt;enter data&gt;" || (col.rowCellValue[$index].split("/")[3])}}</td>
            <!--Here i want that in row cells output_columns.rowCellValueOutput data gets populate on row cell for output column -->
            <td ng-repeat="col in output_columns" ng-click="openDialog($event)">{{(col.rowCellValueOuput[$index] == "") && "&lt;enter data&gt;" || (col.rowCellValueOutput[$index].split("/")[3])}}</td>    

        </tr>
    </tbody>

这是我想要用于 input_column 的实际表格:

但是我得到这个:

我可以用行长度而不是 $index 来迭代 col.rowCellValueOutput[$index] 吗？和每一列。如果是，请为此提出一些方法。

最佳答案

您是否尝试过将其放入 JSON 对象并循环遍历 JSON.看起来您正在尝试做的是，每次创建新行时，inputCol 和 outputCol 都会尝试输出每一行的所有内容。

//pseudo code
ng-repeat row in rows
    ng-repeat input in inputs
    ng-repeat output in outputs

每次你循环rows，所有的inputs和outputs数据都会被再次输出，使得每一行都一样。

如果你制作了一个 JSON 对象并做了类似的事情，

ng-repeat row in rows
    ng-repeat input in row.input
    ng-repeat output in row.output

你的 JSON 看起来像

var rows = [{ input: [ "row1", "col2" ], output: [ "col3", "col4" ] },
            { input: [ "row2", "col2" ], output: [ "col3", "col4" ] }];

关于javascript - 如何在特定标签内使用两个 ng-repeat，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34611959/