Wie integriere ich externe JavaScript-Skripte und Zugriffsfunktionen in Angular?

JavaScript-Skriptdateien in Angular einbinden und Funktionen aufrufen

Die Integration externer JavaScript-Skripte in Angular-Anwendungen und der Zugriff auf deren Funktionen ist ein wichtiger Aspekt der Anpassung und Verbesserung der Funktionalität. Lassen Sie uns untersuchen, wie Sie dies erreichen:

Zugriff auf JavaScript-Funktionen

Um eine JavaScript-Datei mit dem Namen abc.js einzuschließen und ihre Funktion xyz() in Angular aufzurufen, führen Sie die folgenden Schritte aus :

1. Aktualisieren Sie „angular-cli.json“ (oder „angular.json“ in Angular 6)

Ändern Sie die Datei „angular-cli.json“ und fügen Sie den Pfad zur JavaScript-Datei unter der Eigenschaft „scripts“ hinzu.

<code class="json">"scripts": [
    "../path/to/abc.js"
]</code>

2. Definieren Sie eine TypeScript-Deklarationsdatei

Erstellen Sie eine Datei mit dem Namen typings.d.ts im src-Verzeichnis, falls diese nicht vorhanden ist. Fügen Sie dann die folgende Deklaration hinzu, um eine globale Variable für das Skript einzurichten:

<code class="typescript">declare var abc: any;</code>

3. Importieren Sie das Skript in Ihre Komponente

Importieren Sie die JavaScript-Datei mit der folgenden Syntax in Ihre Angular-Komponente:

<code class="typescript">import * as abc from 'abc';</code>

4. Rufen Sie die JavaScript-Funktion auf

Sie können jetzt über die importierte JavaScript-Datei auf die Funktion xyz() zugreifen und diese aufrufen:

<code class="typescript">abc.xyz();</code>

Indem Sie diese Schritte befolgen, können Sie externes JavaScript nahtlos integrieren Fügen Sie Skripte in Ihre Angular-Anwendung ein und nutzen Sie deren Funktionen, um die Funktionalität Ihrer Web-App zu verbessern.

Das obige ist der detaillierte Inhalt vonWie integriere ich externe JavaScript-Skripte und Zugriffsfunktionen in Angular?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!