angularjs - 为什么 ng-repeat 在第 3 级停止工作

Question

我正在使用 angularjs 来呈现层次结构。测试用例在http://jsbin.com/agodoj/1/edit

我的问题是为什么 ng-repeat 停止在第 3 级工作？谢谢

这是我的模型

function Test($scope) {
  $scope.cars = {
    chrylser: {
      nameplates: [{
        name: "np1",
        trims: [
          "tirm1", "trim2"
          ]
      }]
    }
  };
}

这是我的模板

<div ng-app ng-controller="Test">
    <div ng-repeat="(key, value) in cars">
        {{key}}
        <ul>
            <li ng-repeat="np in value.nameplates">{{np.name}}, {{np.trims}}</li>
            <ul>
                <li ng-repeat="trim in np.trims">
                   (ng-repeat stop working here) {{trim}}
                </li>
            </ul>
        </ul>
    </div>
</div>

Answer 1

只需要</li>在你的 inner 之后移动结束标签<ul>。你有<li ng-repeat="np in value.nameplates">立即关闭，结束循环。

  <div ng-app  ng-controller="Test">
    <div ng-repeat="(key, value) in cars">
      {{key}} 
       <ul>
        <li ng-repeat="np in value.nameplates">{{np.name}}, {{np.trims}}
         <ul>
           <li ng-repeat="trim in np.trims">
             works! {{trim}}
           </li>
         </ul>
       </li>
     </ul>
    </div>
  </div>