为什么 ng-repeat 不能与 ng-if 一起工作？

Question

我正在尝试使用 Angular 1.4.8.

填充 table

为什么这行不通...

<td ng-if="fila" ng-repeat="celda in fila">{{ celda }}</td>

...但这？

<td ng-if="fila">{{ fila[0] }}</td>
<td ng-if="fila">{{ fila[1] }}</td>
<td ng-if="fila">{{ fila[2] }}</td>
<td ng-if="fila">{{ fila[3] }}</td>

我的代码如下。

var app = angular.module('myApp', []);

app.controller('ctrlTest', function($scope) {

  $scope.tabla = {
    titulos: ['Caracteristicas', 'Opcion1', 'Opcion2', 'Opcion3', 'Opcion4'],
    datos: {
      'Caracteristica1': [25, 500, 500, 2500],
      'Separador': '',
      'Caracteristica2': ['-', 'X', 'X', 'X'],
      'Caracteristica3': ['-', '-', 'X', 'X']
    }
  };

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>

<div ng-app="myApp">
  <table ng-controller="ctrlTest">
    <tr>
      <th ng-repeat="titulo in tabla.titulos">{{ titulo }}</th>
    </tr>
    <tr ng-repeat="(clave,fila) in tabla.datos">
      <th ng-if="fila">{{ clave }}</th>
      <th ng-if="!fila" colspan="{{ (tabla.titulos).length }}">{{ clave }}</th>

      <td ng-if="fila" ng-repeat="celda in fila">{{ celda }}</td>
    </tr>
  </table>
</div>

Answer 1

你在转发器中有重复项。按 $index 添加曲目到你的 ng-repeat="celda in fila":

<td ng-if="fila" ng-repeat="celda in fila track by $index">{{ celda }}</td>

fiddle: http://jsfiddle.net/1z04c00u/

参见文档：https://docs.angularjs.org/error/ngRepeat/dupes

为什么 ng-repeat 不能与 ng-if 一起工作？

Why won't ng-repeat work with ng-if?

angularjs

angularjs-ng-repeat

angular-ng-if