AngularJS Long Polling - 번호가 0으로 변경된 다음 버그가 발생 함

Question

db 값을 수동으로 변경하고 내 컨트롤러가 10 초마다 API를 쿼리하도록하여 서버 폴링을 시뮬레이션합니다. 모든 것이 작동하지만 DB가 변경되면 뷰의 값이 0으로 변경된 후 값을 변경해야합니다.

컨트롤러보기에서

messageControllers.controller('NavigationCtrl', ['$scope', '$routeParams', 'Message', '$timeout', 
    function ($scope, $routeParams, Message, $timeout) { 

     var messages = Message.query({ type:'inbox' }); 
     $scope.inbox = messages; 

     var poll = function() { 
      $timeout(function() { 
       var messages = Message.query({ type:'inbox' }); 
       $scope.inbox = messages; 
       poll(); 
      }, 10000); 
     };  
     poll(); 
}]); 

발췌문

<li><a data-ng-href="#/">Inbox <span class="badge"><% (inbox|filter:{read:false}).length %></span></a></li> 

예를 들어, read==false 결과의 수가 5이면 db가 변경되고 read==false 결과의 수는 6이됩니다. <% (inbox|filter:{read:false}).length %> 대신 6이 바로 변경되면 0이 먼저 변경됩니다.

각도로 잡기 만하면되고, 내가 멍청한 짓을하는 것을 정말로 이해하지 못한다.

AngularJS가 데이터를 기다리는 동안 나는 (inbox|filter:{read:false}).length의 바운드 값과 관련이 있다는 느낌이 들지만, $ scope.inbox가 Message를 한 번만 변경하도록 변경하는 방법은 잘 모릅니다. 쿼리가 완료되었습니다.

Answer 1

Message.query({ type:'inbox' });은 비동기 요청입니다.

쿼리가 완료된 후 채워지는 참조 개체를 반환합니다. the docs에서 :

$ 자원 객체 메소드 를 호출하는 즉시 빈 참조 (객체 또는 배열 끝나면 IsArray)에 따라 반환 깨닫는 것이 중요하다. 서버에서 데이터가 반환되면 기존 참조가 실제 데이터로 채워집니다.

손쉽게 $promise 속성을 사용하여 쿼리가 끝나면 해결되는 약속에 액세스 할 수 있습니다.

그래서 다음에 시간 제한 함수 내에서 코드를 변경해보십시오 :

var messages = Message.query({ type:'inbox' }); 

// Populate the scope only after the query has resolved. 

messages.$promise.then(function(){ 
    $scope.inbox = messages; 
}); 

poll();