AngularJs。用ng重複和ng開關渲染表格

Question

我在使用angularjs指令嘗試渲染兩列的表格。

<table> 
<tr ng-repeat="message in messages" > 
    <td ng-switch-on="message.network" ng-switch when="twitter" ng-controller="TweetController"> 
     <span> 
      <input type="checkbox" name="active" ng-checked="{{message.isPublished}}" data-id="{{message.socialId}}" ng-click="publishMessage($event)" /> 
     </span> 
     <span> 
      <img src="{{message.authorPicture}}" /> 
     </span> 
     <span>{{message.createdAt}}</span> 
     <span>{{message.network}}</span> 
     <span>{{message.text}}</span> 
    </td> 
    <td ng-switch-on="message.network" ng-switch when="facebook" ng-controller="FacebookController"> 
     <span> 
      <input type="checkbox" name="active" ng-checked="{{message.isPublished}}" data-id="{{message.socialId}}" data-createdAt="{{message.createdAt}}" ng-click="publishMessage($event)" /> 
     </span> 
     <span> 
      <img src="{{message.authorPicture}}" /> 
     </span> 
     <span>{{message.createdAt}}</span> 
     <span>{{message.network}}</span> 
     <span>{{message.text}}</span> 
    </td> 
</tr> 
</table> 

應該有2列 - 第一個應該是twitter消息，第二個應該是facebook的帖子。但在我的情況下，同樣的消息呈現在兩列（像這樣http://puu.sh/5oHT7.png）。我做錯了什麼？

Answer 1

爲了簡單起見，只是重組模式：

$scope.messages = [ 
    [ 
     { 
      "network": "twitter", 
      ... 
     }, 
     { 
      "network": "facebook", 
      ... 
     } 
    ], 
    [ 
     { 
      "network": "twitter", 
      ... 
     }, 
     { 
      "network": "facebook", 
      ... 
     } 
    ]  
] 

HTML：

<table> 
    <tr ng-repeat="message in messages" > 
     <td ng-repeat="msg in message"> 
      <div ng-if="msg.network == 'twitter'"> 
       <div ng-controller="TweetController"> 
        ... 
        <span>{{msg.createdAt}}</span> 
        <span>{{msg.network}}</span> 
        <span>{{msg.text}}</span> 
       </div> 
      </div> 
      <div ng-if="msg.network == 'facebook'"> 
       <div ng-controller="FacebookController"> 
        ... 
        <span>{{msg.createdAt}}</span> 
        <span>{{msg.network}}</span> 
        <span>{{msg.text}}</span> 
       </div> 
      </div> 
     </td>  
    </tr> 
</table>