视图不会在AngularJS中更新
视图不会在AngularJS中更新
提问于 2012-04-17 02:22:19
在事件回调中更新模型时，更新模型属性对视图没有影响，有什么想法可以解决这个问题吗？
这是我的服务：
angular.service('Channel', function() {
var channel = null;
return {
init: function(channelId, clientId) {
var that = this;
channel = new goog.appengine.Channel(channelId);
var socket = channel.open();
socket.onmessage = function(msg) {
var args = eval(msg.data);
that.publish(args[0], args[1]);
};
}
};
});在控制器中动态添加了publish()函数。
控制器：
App.Controllers.ParticipantsController = function($xhr, $channel) {
var self = this;
self.participants = [];
// here publish function is added to service
mediator.installTo($channel);
// subscribe was also added with publish
$channel.subscribe('+p', function(name) {
self.add(name);
});
self.add = function(name) {
self.participants.push({ name: name });
}
};
App.Controllers.ParticipantsController.$inject = ['$xhr', 'Channel'];查看：
<div ng:controller="App.Controllers.ParticipantsController">
<ul>
<li ng:repeat="participant in participants"><label ng:bind="participant.name"></label></li>
</ul>
<button ng:click="add('test')">add</button>
</div>所以问题是，单击按钮可以正确地更新视图，但是当我收到来自Channel的消息时，甚至add()函数也会被调用
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-04-17 04:00:57
您缺少$scope.$apply()。
无论何时从Angular世界之外接触到任何东西，都需要调用$apply来通知Angular。这可能来自于：
- xhr回调(由$http服务回调处理)
- DOM事件回调(由指令处理)
在您的情况下，执行以下操作：
// inject $rootScope and do $apply on it
angular.service('Channel', function($rootScope) {
// ...
return {
init: function(channelId, clientId) {
// ...
socket.onmessage = function(msg) {
$rootScope.$apply(function() {
that.publish(args[0], args[1]);
});
};
}
};
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/10179488
复制相关文章
相似问题
腾讯云开发者
