我在Angular 2中编写了一个SignalR客户端应用程序。客户端实现了一个从SignalR Hub调用的函数connected
。从Hub调用时,此函数只是将布尔变量connected
设置为true
。我正在使用此connected
变量来控制按钮的enable \ disable状态。它在Firefox和Chrome中运行良好,但在IE按钮的启用\禁用状态不反映connected
变量的值。
下面是ASP.NET web api
中SignalR Hub类中的一个函数public void Connect()
{
Clients.Caller.connected();
}
在我的Angular2应用程序中,我有以下服务。 的 signalr-test.service.ts 。
import { Injectable } from '@angular/core';
export class SignalrWindow extends Window {
$: any;
}
@Injectable()
export class SiglalrTestService {
private hubProxy: any;
private hubConnection: any;
private connected = false;
constructor(private window: SignalrWindow) {
if (this.window.$ === undefined || this.window.$.hubConnection === undefined) {
throw new Error("The variable '$' or the .hubConnection() function are not defined...please check the SignalR scripts have been loaded properly");
}
this.hubConnection = this.window.$.hubConnection();
this.hubConnection.url = 'http://localhost:18117/signalr';
this.hubProxy = this.hubConnection.createHubProxy('MyHub');
this.hubProxy.on("connected", () => {
this.connected = true;
console.log('Connected successfully....');
});
}
start(): void {
this.hubConnection.start()
.done(() => {
this.hubProxy.invoke('Connect');
})
.fail((error: any) => {
throw new Error("Failed to start connection" + error);
});
}
stop(): void {
this.hubConnection.stop();
this.connected = false;
}
get isConnected(): boolean {return this.connected;}
}
app.component.ts
import {Component, OnInit} from '@angular/core';
import { SiglalrTestService } from './signalr-test.service';
@Component({
moduleId: module.id,
selector: 'my-app',
templateUrl: 'app.component.html'
})
export class AppComponent implements OnInit{
constructor(private signalrTest : SiglalrTestService){}
ngOnInit(): void {
}
startSignalR(){
this.signalrTest.start();
}
stopSignalR(){
this.signalrTest.stop();
}
get connectedToServer() : boolean{ return this.signalrTest.isConnected; }
}
,模板文件是 的 app.component.html
<div>
<h1>SignalR Test</h1>
<input type="button" [disabled]="connectedToServer" (click)="startSignalR()" value="Start" >
<input type="button" [disabled]="!connectedToServer" (click)="stopSignalR()" value="Stop" >
</div>
我正在使用AngularJS 2.0.1,SignalR 2.2.1和IE 11.
P.S。我已在github
上发布了此问题