angularjs嵌套ng-model的Ng-Repeat问题

时间:2019-01-15 10:00:53

标签: angularjs angularjs-ng-repeat

我正在ng-repeat中使用ng-repeat,如下所示

  <tbody>
        <tr ng-repeat="track in machine.noteMatrix2">
            <td>--</td>
            <td ng-repeat="step in track">
                <input type="checkbox" ng-model="track[$index].value"> 
   {{step.value}}</td>
        </tr>
  </tbody>

下面也是示例http://jsfiddle.net/rskLy/11/

问题是,当我更新machine.noteMatrix2中单个记录的track [$ index] .value时,它会在machine.noteMatrix2中的所有节点中得到更新

有什么解决办法吗?

编辑

data

    machine.noteMatrix = [
        [false, false, false],
        [false, true, false],
        [false, false, false]
    ];

1 个答案:

答案 0 :(得分:0)

除了使用track[$index].value之外,您还必须使用step并通过$index跟踪两个 ngRepeat

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

app.controller("MainCtrl", function($scope) {
  $scope.noteMatrix = [
    [false, false, false],
    [false, true, false],
    [false, false, false]
  ];
});
<html ng-app="app">

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

</head>

<body ng-controller="MainCtrl">
  {{noteMatrix}}
  <table>
    <tbody>
      <tr ng-repeat="track in noteMatrix track by $index">
        <td>-{{$index}}-</td>
        {{track}}
        <td ng-repeat="step in track track by $index">
          <input type="checkbox" ng-model="step"> {{step}}
        </td>
      </tr>
    </tbody>
  </table>
</body>

</html>