按钮的禁用状态不反映IE

时间:2016-10-24 13:46:25

标签: angular

我在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

上发布了此问题

0 个答案:

没有答案