sind globale Variablen in Angular 2 HTML-Vorlage direkt zugänglich?

Question

Also habe ich in AnwendgsOptionen wie

public static get DateFormat(): string { return 'MM/DD/YYYY';} 

und dann in einem meiner HTML-Vorlage einer Komponente i, so etwas tun möchten.

<input [(ngModel)]="Holiday" [date-format]="AppSettings.DateFormat"/> 

In Komponente ich habe

import { AppSettings } from '../../../app.settings'; 

Gerade jetzt, wie diese in HTML-Vorlage nicht zugänglich, es ist. Gibt es irgendeinen Weg?

Answer 1

Nein, der Bereich für Code in der Vorlage ist die Komponenteninstanz. Sie müssen den Wert einem Feld in der Komponente zuweisen oder einen Getter oder eine Methode hinzufügen, die an die globale Variable weiterleitet, um sie aus der Vorlage verwenden zu können.

import { AppSettings } from '../../../app.settings'; 

... 
export class MyComponent { 
    get dateFormat() { 
    return AppSettings.DateFormat; 
    } 
} 

dann können Sie es verwenden, wie

<input [(ngModel)]="Holiday" [date-format]="dateFormat"/> 

Answer 2

Nach bestem Wissen und Gewissen, nein, und das ist von Entwurf. Vorlagen werden in Verbindung mit Komponenten verknüpft, so dass sie ihren Geltungsbereich ableiten und dadurch auf bindbare Daten zugreifen können. Es ist möglich, dass es gehackt werden könnte, aber selbst wenn Sie es herausfinden, ist dies ein Weg, dem Sie nicht folgen sollten.

ich tun, um diese Art der Sache mit einer Klasse:

class AppConfig {} 

AppConfig.Globals = { 
    TEST_VAL: 'hey now here is the value' 
}; 
export { AppConfig } 

Und es dann wie so verwenden:

import { Component } from '@angular/core'; 
import { AppConfig } from '../../app/app.config'; 

class HomeComponent { 
    constructor() { 
     this.test_val = AppConfig.Globals.TEST_VAL; 
    } 
} 

HomeComponent.annotations = [ 
    new Component ({ 
     templateUrl: './views/home/home.component.html' 
    }) 
]; 

export { HomeComponent } 

In der Vorlage:

{{test_val}} 

funktioniert gut für mich .