Angular 2 Globale Konstanten

1. Deklarieren Sie Angular 2 globale Konstanten
2. Vorteile globaler Konstanten

Das Angular 2-Framework hat viele Konstanten, die von den verschiedenen Komponenten im Framework verwendet werden. Auf diese Konstanten kann mit dem Modul angle2 zugegriffen werden, das im Stammverzeichnis Ihres Projektverzeichnisses verfügbar ist.

Um Zeit zu sparen, nehmen wir Hilfe von globalen Konstanten. Angular 2 Globale Konstanten speichern einen Wert in einem globalen Namespace.

Sie bieten eine Möglichkeit, die Daten zu verfolgen, die von allen Teilen der Anwendung benötigt werden. Dies ist nützlich, wenn wir von verschiedenen Teilen der Anwendung auf denselben Wert zugreifen müssen.

Deklarieren Sie Angular 2 globale Konstanten

Angular 2 bietet einen Mechanismus zum Deklarieren globaler Konstanten. Globale Konstanten werden mit dem Schlüsselwort const deklariert und sind überall in der Anwendung zugänglich.

Dazu müssen die folgenden Schritte befolgt werden.

1. Erstellen Sie eine Konstantendatei, indem Sie ihr die Erweiterung .ts hinzufügen.
2. Schreiben Sie den konstanten Wert in die Datei und exportieren Sie ihn als globale Variable, indem Sie das export default Schlüsselwort const verwenden.
3. Importieren Sie diese Datei in Ihr App-Modul, indem Sie das Schlüsselwort import gefolgt vom Pfad Ihrer konstanten Datei verwenden.

Codebeispiel:

const MY_CONSTANT = 'This is my constant';

// Use MY_CONSTANT in the rest of your app like this:

console.log(MY_CONSTANT);

Lassen Sie uns ein vollständiges Beispiel für globale Angular 2-Konstanten besprechen, um besser zu verstehen, wie es funktioniert.

Schreibmaschinencode:

import { Component } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
   readonly CONSTANTS = CONSTANTS;
  global: { name: string; };
  constructor() {
    this.global = { name: 'demo' }
  }
}
export const CONSTANTS = {
  'globalName': 'demo'
}

HTML Quelltext:

<h1>Example of Angular 2 Global Constants</h1>
<span *ngIf="global.name === CONSTANTS.globalName ">
    Hello World
</span>

Vorteile globaler Konstanten

Angular 2 verwendet globale Konstanten, um Entwicklern die Arbeit mit Zahlen zu erleichtern. In Angular 2 werden globale Konstanten als Alternative zu hartcodierten Werten im Code verwendet.

Die Vorteile der Verwendung globaler Konstanten in Angular 2 sind die folgenden.

1. Entwickler können einfacher mit Zahlen arbeiten.
2. Die Werte können geändert werden, ohne den Code zu ändern.
3. Entwickler können schnell Änderungen vornehmen.
4. Der Entwickler muss sich keine Gedanken über Tippfehler oder Bugs machen, da der Compiler sie abfängt.

Klicken Sie hier, um das obige Codebeispiel auszuführen.