$ scope。$ on不會更新我的角度服務中的UI

我通過WebSocket連接到我的服務器並接收一些實時更新。通過$rootScope.$broadcast我將這些更新廣播給在應用程序中偵聽的任何人。

 function handleTickerMessage(msg){ 
      //console.log(JSON.stringify(msg)); 
      $rootScope.$broadcast(config.events.ticker, msg); 
     }

在控制器我訂閱該事件並更新某些局部變量

$scope.mainPair = { 
     name: '', 
     buy: 110.00, 
     sell: 80.00 
    }; 

    $scope.$on(config.events.ticker, function(event, ticker){ 
     if (config.mainPage.prodPair === ticker.prodPair){ 
      $scope.mainPair.name = config.mainPage.prodPair; 
      $scope.mainPair.buy = parseFloat(ticker.bid); 
      $scope.mainPair.sell = parseFloat(ticker.ask); 
     } 
    });

在HTML文件中我試圖顯示這些新值

<span><i class="down"></i><em>{{mainPair.buy | currency}}</em></span>

但對於一些他們沒有被顯示的原因。我知道我的$on被調用，並且if正在工作。那麼爲什麼UI不更新？

滑稽認爲，如果我從mainPair在點擊事件訪問值

$scope.signUp = function(){ 
     console.log('buy: ' + $scope.mainPair_buy); 
     return; 
    }

然後我得到的最後一個值和UI更新！

那麼爲什麼在事件發生時UI不會更新？

THX

來源

2014-06-21 Eugen

你可以試試'$ scope。$ apply（）'在你的'$ on'中，只是爲了確定嗎？ – Ven

嘗試添加'$ scope。$ apply（）' – Safari

如果你從angular.js框架之外調用handleTickerMessage，你必須把它包在$scope.$apply。

例如，無論你使用必須WebSocket的代碼來完成：

socket.on('someevent', function(msg){ 
    $rootScope.$apply(function(){ 
     handleTickerMessage.call(null, msg)); 
    }); 
});

檢查出$rootScope的文檔：

$申請（[曝光]）;
$ apply（）用於從角度框架的外部執行角度表達式。（例如，來自瀏覽器DOM事件，setTimeout，XHR或第三方庫）。因爲我們正在調用角度框架，所以我們需要執行適當的異常處理範圍生命週期，執行手錶。

來源

2014-06-21 23:36:02

thx，這有幫助！我寫它就像這個函數onSocketMessage（e）{msg = JSON.parse（e.data）; （'msg.messageType'）{ case'Ticker'：$ rootScope。$ apply（function（）{handleTickerMessage（msg）;}）;打破; } } function handleTickerMessage（msg）{ $ rootScope。$ broadcast（config.events.ticker，msg）; } – Eugen

$ scope。$ on不會更新我的角度服務中的UI

回答

相關問題