반응형
AngularJS에서보기가 업데이트되지 않았습니다.
모델 속성을 업데이트해도 이벤트 콜백에서 모델을 업데이트 할 때 뷰에 영향을주지 않습니다.이 문제를 해결할 아이디어가 있습니까?
이것은 내 서비스입니다.
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>
그래서 문제는 버튼을 클릭하면 뷰가 제대로 업데이트되지만 채널에서 메시지를 받으면 아무 일도 일어나지 않고 add()
함수가 호출 된다는 것입니다.
당신은 누락되었습니다 $scope.$apply()
.
Angular 세계 외부에서 무엇이든 터치 할 때마다을 호출 $apply
하여 Angular에 알립니다. 그 출처는 다음과 같습니다.
- xhr 콜백 ($ http 서비스에서 처리)
setTimeout
콜백 ($defer
서비스에서 처리 )- 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]);
});
};
}
};
});
참고URL : https://stackoverflow.com/questions/10179488/the-view-is-not-updated-in-angularjs
반응형
'programing tip' 카테고리의 다른 글
hash_map이 STL의 일부입니까? (0) | 2020.12.11 |
---|---|
Rsync include 및 exclude 옵션을 사용하여 패턴별로 디렉터리 및 파일 포함 (0) | 2020.12.11 |
Google Maps Container DIV 너비 및 높이를 100 % 설정 (0) | 2020.12.11 |
작업 표시 줄 아이콘 크기 (0) | 2020.12.11 |
MySQL 대 PostgreSQL? (0) | 2020.12.10 |