我希望我的角度控制器能够通过与websockets连接的工厂进行更新。
工厂:
function($rootScope, mySocketFactory) {
mySocketFactory.setHandler('message', function(event) {
$rootScope.$apply(function() {
Factory.msg = event.data;
});
console.log('factory', Factory.msg);
});
var Factory = {};
Factory.msg = 'init';
return Factory;
}
控制器:
function ($scope, myFactory) {
console.log(myFactory.msg);
$scope.msg = myFactory.msg;
}
部分:
<div data-ng-controller="StatusBarController" class="col-lg-12">
{{msg}}
</div>
如果工厂通过message
事件console.log('factory', Factory.msg);
获取数据,则返回更新的值,但控制器不应用更改并坚持init
数据。我在这里做错了什么?
注意: 我尝试了使用数组而不是字符串的相同示例,它运行了!?首先我认为可能是因为字符串不是通过引用传递的,但是因为我们处于JS世界中它们是。
答案 0 :(得分:1)
您可以创建一个getter
函数表单工厂,而不是绑定一个属性,它将返回msg
属性值,html上的{{msg()}}
将在每个摘要周期得到评估,就像你一样每当您收到message
时,都会从您的服务中运行它。
<强>工厂强>
var Factory = {};
Factory.getMsg = function(){
return Factory.msg;
};
return Factory;
<强>控制器强>
function ($scope, myFactory) {
$scope.msg = myFactory.getMsg;
}
<强> HTML 强>
<div data-ng-controller="StatusBarController" class="col-lg-12">
{{msg()}}
</div>
<强>更新强>
我建议您遵循dot rule
而不是上述方式,需要声明object
并且该对象将保留属性Factory.data = {msg:'init'} ;`更新工厂变量后,它将自动更新控制器变量中的引用。
<强>工厂强>
function($rootScope, mySocketFactory) {
mySocketFactory.setHandler('message', function(event) {
$rootScope.$apply(function() {
Factory.data.msg = event.data;
});
console.log('factory', Factory.msg);
});
var Factory = {};
Factory.data = { msg : 'init'};
return Factory;
}
<强>控制器强>
function ($scope, myFactory) {
$scope.info = myFactory.data;
}
<强> HTML 强>
<div data-ng-controller="StatusBarController" class="col-lg-12">
{{info.msg}}
</div>