強制DOM渲染到$ scope模型參考到工廠模型的更改

我正在使用AngularJS 1.2.0通過websocket創建一個簡單的消息應用程序。 HTML在列表中使用ng-repeat來生成總輸出（我輸入的一組消息）。我使用的是工廠舉辦「私人」的數據和方法，只露出視圖模型和功能來操縱控制器中的數據：

<form class="form-search"> 
    <input type="text" ng-model="model.input" class="input-large" 
      placeholder="Enter your message:"> 
    <button type="submit" class="btn" ng-click="sendMessage()">Send</button> 
</form> 

<ul> 
    <li ng-repeat="message in model.output track by $index" ng-bind="message"></li> 
</ul> 


application.controller('MessageCtrl', ['$scope', 'MessageService', function($scope, Service) { 
    $scope['model'] = Service.view; 

    $scope.sendMessage = function() { 
     Service.sendMessage(); 
    }; 

    $scope.$watchCollection(function() { 
     return Service['view']; 
    }, function(data) { 
     $scope['model'] = data; 
    }); 
}]) 
.factory('MessageService', function('Restangular') { 
    var Service = { 
     // other private properties 
     view: { 
      input: null, 
      output: [] 
     } 
    }; 

    openConnection(); 

    function openConnection() { 
     // retrieves websocket URL over Restangular 
     // opens websocket 
    } 

    function sendMessage() { 

     // sends input over socket 
     // promises are resolved and unshifted onto Service['view']['output']. 
    } 

    return { 
     view: Service['view'], 
     sendMessage: function() { 
      sendMessage();  
     } 
    } 
});

一切工作正常，除了DOM的NG-重複不當Service ['view']中的輸出數組獲取新消息時進行更新。我已經嘗試使用$ watchCollection作爲此線程中的解決方案：AngularJS : The correct way of binding to a service properties，但這也不起作用。我可以讓DOM重新呈現的唯一方法是通過更改輸入文本或觸發CSS中的懸停狀態來強制重新呈現它。

鑑於此設置，觸發摘要的最佳方法是什麼，以便在用新消息數據解析承諾並且未轉移到輸出數組時，DOM呈現？我希望避免使用$ rootScope並觸發事件，因爲當其他控制器使用工廠時可能會非常不清潔。

來源

2013-11-22 SirTophamHatt

在服務中，我添加了$ rootScope依賴項並使用了$ rootScope。$ apply（），其中promises正在解析並更新模型。

$rootScope.$apply(function() { 
    Service['view']['output'].unshift(newMessage) 
});

這似乎解決了摘要問題，雖然我不知道副作用是什麼。

來源

2013-11-22 17:28:47 SirTophamHatt

強制DOM渲染到$ scope模型參考到工廠模型的更改

回答

相關問題