2013-02-27 75 views
1

我有一个学生的记录本的HTML代码和它的工作好如何显示在角JS

<li ng:repeat="student in students"> 
     <a href='#/student/{{ student.id }}'>{{ student.number }}</a> 
</li> 

但我有细节少数几个嵌套级别,我想表明这样

嵌套列表
<ul> 
<li ng:repeat="student in students"> 
      <a href='#/student/{{ student.id }}'>{{ student.number }}</a> 
      if {{ student.subjects}} > 0 
       //some indenting 
       <ul> 
      <li ng:repeat="subject in subjects"> 
         <a href='#/student/subject/{{ subject.id }}'>{{ subject.name }}</a> 
         if {{ subjects.assignments}} > 0 
         <ul> 
         <li ng:repeat="subject in subjects"> 
         <a href='#/student/subject/assignment/{{ assignment.id }}'>{{ assignment.name }}</a> 
         <li> 
         </ul> 
      <li> 
      </ul> 
     </li> 
     </ul> 

但我不知道该角的语法,我怎么能做到这一点

回答

4

你可以在孩子的UI元素使用NG-表演,并反复在自己的NG-重复每个级别。注意:你不需要像if {{ student.subjects}} > 0(这不是一个有效的JS代码btw)的东西。如果收集为空,ngRepeat将不会迭代:

<ul> 
    <li ng-repeat="student in students"> 
    <a href='#/student/{{ student.id }}'>{{ student.number }}</a> 
    <ul ng-show="student.subjects && student.subjects.length"> 
     <li ng-repeat="subject in student.subjects"> 
     <a href='#/student/subject/{{ subject.id }}'>{{ subject.name }}</a> 
      <ul ng-show="subject.assignments && subject.assignments.length"> 
      <li ng-repeat="assignment in subject.assignments"> 
       <a href='#/student/subject/assignment/{{ assignment.id }}'>{{ assignment.name }}</a> 
      <li> 
      </ul> 
     <li> 
    </ul> 
    </li> 
</ul>