Question

我的范围内有一个名为checkedInChildren的数组。该数组只包含字符串值。我希望在checkedInChildren数组中为每个字符串重复一个表。以下是我到目前为止的情况：

<div ng-app="MyApp" ng-controller="myCtrl">
  <div>
    <table>
      <thead>
        <tr>
          <th>Name</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="child in checkedInChildren">
          <td>test</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>

这是我的控制器：

app.controller("myCtrl", function($scope, $http) {

  $scope.checkedInChildren = [];

  $scope.addChildToCheckedIn = function(childName) {
    $scope.checkedInChildren.push(childName);
  }

});

无论我添加到该数组的名称，都不显示任何行。我省略了控制器中的一些代码和一些HTML，但我正在调试并清楚地看到数组中的值。有什么想法吗？

Answer 1

您必须添加{{child}}才能将每个项目绑定到视图。

<tr ng-repeat="child in checkedInChildren">
  <td>
    {{child}}
  </td>
</tr>

Answer 2

Working Plnkr

它没有显示test，因为您的checkedInChildren数组中没有项目。

From Angular Doc:

ngRepeat指令从a中为每个项目实例化一次模板集合。

  $scope.checkedInChildren = [];

  $scope.addChildToCheckedIn = function (childName) {
        $scope.checkedInChildren.push(childName);
  }

  $scope.addChildToCheckedIn('John');

您没有调用addChildToCheckedIn方法，这就是checkedInChildren数组为空的原因。

希望能解决你的问题。

Answer 3

在您的HTML上引用不同的控制器，输入正确的名称

<div ng-app="MyApp" ng-controller="checkInCtrl">...</div>

Demo

Answer 4

您是否致电addChildToCheckedIn功能？ Try这个。希望这会有所帮助。

为什么不重复在这里工作？

4 个答案: