1
Я пытаюсь обновить свой интерфейс, когда получаю звонок с сервера SignalR.Обновить UI из вызова SignalR
В моем примере кода у меня есть два тега Div, которые, в свою очередь, управляются разными угловыми контроллерами. У меня есть служба SignalR, которую я ввел в один контроллер. При приеме события из службы SignalR первый контроллер передает сообщение, и второй контроллер прослушивает его. Он должен обновить пользовательский интерфейс, но его не делать ...
Что я делаю неправильно?
Вот мои AngularJS & HTML код:
'use strict'
var testapp = angular.module('testapp', []);
testapp.factory('testService',
function() {
return {
testvariable: 0
};
});
testapp.service('signalRService',
function($rootScope, $scope, testService) {
var myChatHubProxy = null;
var connection = null;
var initialize = function() {
//my signalr server resides here
connection = $.hubConnection("http://localhost:28014");
//creating a proxy
myChatHubProxy = connection.createHubProxy('myChatHub');
//Publishing an event when server pushes a greeting message
myChatHubProxy.on('addMessage', function(message) {
console.info('Message received from signalr server.');
$rootScope.$broadcast('MsgFromSRServer');
});
connection.start()
.done(function() {
console.log('SignalR now connected. Connection Id: ' + connection.id);
})
.fail(function() {
console.log('Could not connect!');
});
};
initialize();
return {
initialize: initialize
};
});
testapp.controller('SimpleController', ['$rootScope', '$scope', 'testService', 'signalRService',
function($rootScope, $scope, testService, signalRService) {
$scope.makechanges = function() {
testService.testvariable++;
$rootScope.$broadcast('MsgFromButtonClick');
};
}
]);
testapp.controller('SecondController', ['$rootScope', '$scope', 'testService',
function($rootScope, $scope, testService) {
$rootScope.$on('MsgFromButtonClick', function() {
$scope.testvar = testService.testvariable;
});
$rootScope.$on('MsgFromSRServer', function() {
testService.testvariable++;
$scope.updateuimanually();
});
$scope.updateuimanually = function() {
$scope.manualvar = testService.testvariable;
};
}
]);<!DOCTYPE HTML>
<html ng-app="testapp">
<head>
<title>AngularJS - SignalR Sample.</title>
</head>
<body>
<div ng-controller="SimpleController" style="background-color: #c1c1a1; width: 50%; float: left; height: 200px;">
<br />
<br />
<button ng-click="makechanges()">Make Change in Second Controller</button>
<br />
<br />
<br />
</div>
<div ng-controller="SecondController" style="background-color: #a1b1c1; width: 49%; float: right; height: 200px;">
<br />
<h3>{{ testvar }}</h3>
<button ng-click="updateuimanually()">Update Manually</button>
<h3>{{ manualvar }}</h3>
<br />
<br />
</div>
<script src="angular.js"></script>
<script src="jquery-1.10.2.js"></script>
<script src="jquery.signalR-2.2.0.js"></script>
<script src="datacontainer2.js"></script> <!-- my angular file -->
</body>
</html>
Может ли он подключиться к вашему сервису signalR и т. Д.? Какая фактическая ошибка происходит –
Да, она очень хорошо подключается к моей службе SignalR ... и это проблема ... ничего не происходит ... когда я получаю сообщение от сервера SignalR, он должен показывать обновленную переменную на 2-м контроллере. .. – Shrewdroid
Попробуйте это в своей функции addMessage: '$ scope. $ Apply (function() {$ rootScope. $ Broadcast ('MsgFromSRServer');});' I * think *, что может быть проблемой? –