Wie global js Variable in angular2 Komponente zuzugreifen

Question

ich eine globale Variable js unten definiert haben (@Url ist eine HTML-Helfer ASP.Net MVC in einen String-Wert konvertiert wird erhalten):

<script> 
    var rootVar = '@Url.Action("Index","Home",new { Area = ""}, null)'; 
    System.import('app').catch(function(err){ console.error(err); }); 
</script> 

Wie Ich greife auf rootVar in einer angular2-Komponente zu? Ich habe den Fensterservice in Winkel 1.5 benutzt, gibt es eine analoge Vorgehensweise in angular2?

Insbesondere möchte ich, dass rootVar Variable verwenden, um die templateUrl in dieser Komponente zu helfen zu erzeugen:

import { Component, Inject} from '@angular/core'; 

@Component({ 
    selector: 'home-comp', 
    templateUrl: '../Home/Root' 
}) 

export class HomeComponent { 
    constructor() { } 
} 

Answer 1

Sie müssen die Datei aktualisieren, die Ihre Anwendung Schopf aus dem Sumpf, eine Funktion zu exportieren:

import {bootstrap} from '...'; 
import {provide} from '...'; 
import {AppComponent} from '...'; 

export function main(rootVar) { 
    bootstrap(AppComponent, [ 
    provide('rootVar', { useValue: rootVar }) 
    ]); 
} 

Jetzt können Sie die Variable aus der index.html Datei auf diese Weise bereitstellen:

<script> 
    var rootVar = '@Url.Action("Index","Home",new { Area = ""}, null)'; 
    System.import('app/main').then((module) => { 
    module.main(rootVar); 
    }); 
</script> 

Dann können Sie die rootVar in Komponenten und Dienste auf diese Weise injizieren:

import { Component, Inject} from '@angular/core'; 

@Component({ 
    selector: 'home-comp', 
    templateUrl: '../Home/Root' 
}) 
export class HomeComponent { 
    constructor(@Inject('rootVar') rootVar:string) { } 
} 

Answer 2

Ein anderer Ansatz wäre Ihre var zu exportieren, für die Ex:

export var API_ENDPOINT = '@Url.Action("Index","Home",new { Area = ""}, null)'; 

und importieren Sie dann, dass in Ihrer Komponente

import {API_ENDPOINT } 

Answer 3

Innerhalb Ihrer Komponente können Sie Fenster verweisen auf die globalen Variablen zugreifen wie so:

rootVar = window["rootVar"]; 

oder

let rootVar = window["rootVar"]; 

Answer 4

in der Komponentendatei Definition außerhalb Komponentenklasse, erklärt rootVar, und es wird in der Komponente Konstruktor zur Verfügung steht:

declare var rootVar: any; 

dann

@Component(...) 
export class MyComponent { 
    private a: any; 

    constructor() { 
    this.a = rootVar; 
    } 
} 

Answer 5

Hier vergessen Sie nicht, Ihre Hände zu waschen ... Angular ist nur und Javas cript

//Get something from global 
let someStuffFromWindow= (<any>window).somethingOnWindow; 

//Set something 
(<any>window).somethingOnWindow="Stuff From Angular"; 

Das ist schlecht aus irgendeinem Grund .. Sie sollten sich schlecht fühlen!