2016-10-03 5 views
1

Ich bin wie so socket.io in meiner Anwendung laden:Injizieren Fensterobjekt in eine Komponente in Angular mit DI

index.html 
<script src="http://myapp.com/socket.io/socket.io.js"></script> 
... 
// Angular stuff 

Ich habe eine Komponente namens Socket die window.io arbeiten erfordert.

Theoretisch kann es funktionieren (nicht getestet), aber es ist keine gute Praxis, Zeug aus dem Fensterbereich in Klassen zu injizieren.

Gibt es eine Möglichkeit, es so zu tun:

import { SocketIODriver } from 'socket.io'; 
import { Socket } from 'App/Socket/Socket'; 

@Component({ 
    templateUrl: 'layout.html' 
}) 
export class ConferenceApp { 
    constructor(
    public io: io, 
    public Socket: Socket 
    ) { 
     this.socket = new Socket(new SocketIODriver()); 
    } 
} 

Danke.

Ps. IIRC, socket.io muss vom Server geladen werden, deshalb lade ich es von meinem Server. Wenn es in meinen JS-Ordner gelegt werden kann, wäre das noch besser.

Antwort

2

Angular 2 arbeitet mit Injektoren. Jeder Injektor kann so verwendet werden, dass Sie ihn leicht verwenden können.

Wenn Sie beispielsweise die angular 2 Injector API betrachten, können Sie ein Objekt namens {useValue: 'theValueToInject'} verwenden.

diese Weise, wenn Sie etwas injizieren, die bereits instanziiert wird, oder ist nur ein Wert (auch bekannt als Fensterobjekt zum Beispiel) Sie es mit dem Injektor des Moduls durch useValue passieren können:

@NgModule({ 
    declarations: [ 
    ... 
    ], 
    imports: [ 
    ... 
    ], 
    providers: [ 
    { provide: 'Window', useValue: window } 
    ], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

Und so können Sie es wie verwenden:

constructor(@Inject('Window') private window: any) {} // or window type, I don't know what it's exaclty 
Verwandte Themen