Question

我有像这样的json数据

data= [ ...
    .........
    .........
    contact:[
    { 
      type: 1,
      Name: xxxx,
      city: XX city
    },
    { 
      type: 2,
      Name: yyyyy,
      city: YY city
    },
    { 
      type: 3,
      Name: zzzz,
      city: ZZ city
    }]
  ]

现在我有这样的HTML：

<div id='type1'>
    Some other info for type 1
    <div>{{data.contact.Name}}</div>
    <div>{{data.contact.city}}<div>
</div>
<div id='type2'>
    <dl>
         <dd>{{data.contact.Name}}</dd>
         <dt>{{data.contact.city}}</dt>
    </dl>
    Labels are different for type 2
</div>
<div id='type3'>
  Entire color, label and controls are different for type 3
   <table>
      <tr>
         <td>{{data.contact.Name}}</td>
         <td>{{data.contact.city}}</td>
      </tr>
   </table>
</div>

Type1 div应仅与类型1的联系人绑定，对于类型2和3则相同。

控制列表在每个部分都很大，应该避免任何三元逻辑。

简单的for循环在这里不起作用。

Answer 1

你可以简单地使用ng-repeat指令来表示这种情况，你不必担心渲染，JSON会重复div，因为有很多类型。

<强>标记

<div id="{{c.type}}" ng-repeat="c in data.contact">
   {{c.Name}}: {{c.city}}
</div>

Angularjs有条件地填充控制

1 个答案: