未捕获的错误:找不到jQuery。请确保在SignalR客户端JavaScript文件

时间:2017-08-03 10:57:31

标签: angular signalr

我试图用SignalR实现一个应用程序,但是我收到了这个错误,我在stackoverflow中查看了其他类似的问题,但我相信我的不同。

我已经安装了jquery,signalr。

npm install jquery signalr --save

并导入我的组件。

import { Component } from '@angular/core';
import * as $ from "jquery"; 
import "signalr";

export class AppComponent {

   private connection: any;

    //signalR proxy reference
    private proxy: any;

    private jQuery = $;
    constructor() {
      this.connection = $.hubConnection("http://www.example.com");  
        // create new proxy as name already given in top  
        this.proxy = this.connection.createHubProxy('SignalRHub'); 
    }
}

同样在index.html中,顺序正确。

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="http://ajax.aspnetcdn.com/ajax/signalr/jquery.signalr-2.2.1.min.js"></script>

1 个答案:

答案 0 :(得分:0)

我已经解决了定义jQuery变量的问题。这是工作版本,我会考虑它可以帮助某人。

import { Component } from '@angular/core';
import "jquery"; 
import "signalr";

declare var jQuery:any;
declare var $:any;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {

   private connection: any;

  //signalR proxy reference
  private proxy: any;

  private jQuery = $;
  constructor() {
    // debugger;
    this.connection = $.hubConnection("http://wwwexample.com/api");  
    // create new proxy as name already given in top  
    this.proxy = this.connection.createHubProxy('SignalRHub'); 
    this.proxy.on('messageReceived', (latestMsg) => this.onMessageReceived(latestMsg));

    this.connection.start();

    // this.broadcastMessage("test");
  }

  private onMessageReceived(latestMsg: string) {
    debugger;
      console.log('New message received: ' + latestMsg);
  }

  //method for sending message
  broadcastMessage(msg: string) {
      //invoke method by its name using proxy 
      // this.proxy.invoke('GetRealTime', msg);
      this.proxy.invoke('Hello');
  }    
}