javascript - 对象数组内的数组上的 Angular ng-repeat

Question

我在访问 AngularJS 中的对象数组内的数组时遇到问题。

HTML:

<li ng-repeat="ai in main.a2">
  <div np-repeat="bi in ai.b">
    <span ng-bind="bi"></span>b2
  </div>
 </li>

JavaScript:

var app = angular.module('app', []);
app.controller('MainCtrl', ['$scope', function($scope) {
  self.a2 = [
    {b: ['foo']},
    {b: ['bar', 'baz']},
    {b: ['boo']}
 ];
}]);

预期输出:

foob2
foobazb2
boob2

实际输出:

b2
b2
b2

这是(非工作)example .

我检查过类似的帖子，但其中大多数只是错误，所以可能是我的。但我检查了错误，所以我认为我陷入了一些陷阱。

Answer 1

您在<div np-repeat="bi in ai.b">中有拼写错误。将其更改为:

<div ng-repeat="bi in ai.b">

function MyCtrl($scope) {
    $scope.a2 = [
       {b: ['foo']},
       {b: ['bar', 'baz']},
       {b: ['boo']}
    ];
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app ng-controller="MyCtrl">
   <li ng-repeat="ai in a2">
       <div ng-repeat="bi in ai.b">
         <span ng-bind="bi"></span>b2
       </div>
   </li>
</div>