Question

我有一个不同类型的项目列表，我想在表格中显示它们。一种类型的项目将具有两列，而另一种类型的项目只有一列。任何有关如何有条件地改变＆lt;＆gt;上的colspan的建议飞行中的标签？

 <div ng-init="items = [
    {name:'item1', old:1, new:2}, 
    {name:'item2', old:2, new:2},
    {name:'item3', msg: 'message'},
    {name:'item4', old:0, new:2}
  ]">
  <table border=1>    
    <tr  ng-repeat="item in items" >                   
     <th>{{item.name}}</th>
     <td>{{item.old}}</td>  
     <td colspan='2'>{{item.msg}}</td>     
     <td>{{item.new}}</td>      
    </tr>              
 </table>

以下是jsfiddle中的示例：http://jsfiddle.net/38LXt/1/

谢谢！

Answer 1

您可以使用条件指令（例如ng-show）执行以下操作：

<table border=1>    
   <tr  ng-repeat="item in items" >                   
      <th>{{item.name}}</th>
      <td>{{item.old}}</td>  
      <td colspan="2" ng-show="item.type == 'typeA'">{{item.msg}}</td>
      <td ng-show="item.type == 'typeB'">{{item.msgB1}}</td>     
      <td ng-show="item.type == 'typeB'">{{item.msgB2}}</td>          
      <td>{{item.new}}</td>      
   </tr>              
</table>

有关ng-show的更多信息：

ngShow directive

如何在AngularJS中的ng-repeat中动态格式化表

1 个答案: