實時表AngularJS

Question

我正在使用Twitter流API。我的服務器從concretes主題標籤獲取推文。爲此，我使用IO套接字。客戶端從套接字接收消息：

socket.on('tweet', function(msg) { 
 
    console.log(msg); 
 
    $scope.streaming.push(msg); 
 
});

你可以看到，我也推消息在表中稱作流。在HTML我有NG-重複指令：

<table class="table table-bordered table-hover table-striped"> 
 
    <tr ng-repeat="tweet in streaming"> 
 
     <td> 
 
     <div class="col-lg-2"> 
 
      <i class="fa fa-twitter" aria-hidden="true"></i> 
 
     </div> 
 
     <div class="col-lg-10"> 
 
      {{tweet}} 
 
     </div> 
 
     </td> 
 
    </tr> 
 
</table>

表開始空和填充的鳴叫進來，不過頁面不會有改變。只有當我停止服務器時纔會顯示推文。

爲什麼會發生這種情況？

Answer 1

socket.on回調用完了角度摘要循環，因此您看不到結果。

因此，您需要通過調用$apply或$timeout來觸發摘要循環。

例如：

socket.on('tweet', function(msg){ 
    console.log(msg); 
    $timeout(function(){ 
     $scope.streaming.push(msg); 
    });   
});