web-dev-qa-db-ja.com

スコープが変更されたときにAngularJSがテンプレート変数を更新しない

これは、専門家にとって非常に明白な愚かな質問の1つになります。

データを保存しようとしているサービスにデータをプッシュするWebSocketがあり、コントローラーを介してテンプレートにプッシュしています。

データが入って変数を更新していますが、UIのみが更新され、そのデータに対してアクションを実行します。

services.factory('Summary', ['$q','$rootScope','$http', '$location', function ($q, $rootScope,$http, $location) {

var Service = {};
Service.dataObj = {};
Service.dataObj.d = {"gello":"goodbye"};
....
function listener(data) {
   messageObj = data;
    Service.dataObj.d = data;
  console.log("Received data from websocket: ", messageObj);

}
})]);


controllers.controller('UserCtrl', ['$scope', 'Summary',
function ($scope, Summary) {

    $scope.click = function(){
        alert(JSON.stringify($scope.summaryinfo));
    }
    $scope.summaryinfo = [Summary.dataObj];
    $scope.summarygridOptions = {
        data: 'summaryinfo'
    };
    console.log("hello");
}]);

HTMLテンプレートをService.dataObjにポイントすると、そのオブジェクトは更新されて置き換えられないため、ポインターはそのままにしてオブジェクトを監視する必要があるため、データはService.dataObj.dに格納されているため、データがポンプインされます。 。

ただし、click（）メソッドを実行しない限り変更されません。実行すると、アラートをトリガーしただけでもUIが影響を受けます。

何が足りないのですか？

javascriptangularjsangularjs-scopeangularjs-service
15
bugg_tb

おそらく使用する必要があります $apply() ：

$ apply（）は、angular angularフレームワークの外部から（たとえば、ブラウザーのDOMイベント、setTimeout、XHR、または3番目から）式を実行するために使用されます。パーティーライブラリ）。

function listener(data) {
   $scope.$apply(function() {
       Service.dataObj.d = data;
   });
}
21
JB Nizet