更新(高级理念/概念)
总结一下,我希望在控制器中动态更新值,该控制器绑定到Web Socket服务,该值更改。以下是我如何解决问题的尝试以及我所面临的障碍。
每次套接字推送服务中的信息时,我想更新控制器中的视图模型。为了模仿消息的推送,我只是每秒调用一次超时,这反过来增加了服务中的健康值,我验证它在控制台中工作。
虽然控制器内的健康值永远不会更新,但我却不知道我做错了什么。以下是相关代码的片段。
这是控制器
(function () {
'use strict';
angular
.module('xxx')
.controller('DashboardController', ['$scope','$timeout', "$uibModal", "dashboardService", "syncService", DashboardController]);
function DashboardController($scope, $timeout, $uibModal, dashboardService, syncService) {
var vm = this;
// VERSIONS
vm.versions = {};
// HEALTH
vm.health= syncService.health;
// JUMP-START
activate();
//////////////
function activate(){
getVersions();
}
function getVersions(){
dashboardService.getVersions()
.then(function(data) {
vm.versions = data;
return vm.versions;
});
}
}
})();
这是服务
(function () {
'use strict';
angular
.module('xxx')
.service('syncService',['$timeout', syncService]);
function syncService($timeout) {
//Init WebSocket
var self = this;
self.health= 0;
updatedStatus();
///////////
....
function updatedStatus(){
$timeout(updatedStatus, 1000);
self.health += 1;
$timeout(angular.noop);
};
}
})();
更新
我想知道如何使用$ scope 无使用$ scope。例如以下question
中接受的答案谢谢
答案 0 :(得分:1)
AFAIK,您需要关注服务变量。这就是我为此而努力的方法:
function DashboardController($scope, $timeout, $uibModal, dashboardService, syncService) {
var vm = this;
// VERSIONS
vm.versions = {};
// HEALTH
vm.syncService = syncService;
$scope.$watch('vm.syncService.health', function(newHealth, oldHealth){
vm.health = newHealth;
})
// JUMP-START
activate();
//////////////
function activate(){
getVersions();
}
function getVersions(){
dashboardService.getVersions()
.then(function(data) {
vm.versions = data;
return vm.versions;
});
}
}
我在评论和答案中链接了一个类似的问题,如果您需要多个控制器来了解服务中变量值的任何变化,他们还会讨论使用$broadcast。