webentwicklung-frage-antwort-db.com.de

Wie rufe ich eine externe Java-Skript-Funktion in Winkel 5 auf?

Ich habe ein Theme von this link heruntergeladen. Ich muss Skript und CSS in der Datei index.html definieren.

index.html (Hauptteil)

<body>
  <app-root></app-root>
  <script type="text/javascript" src="./assets/js/main.85741bff.js"></script>
  <script type="text/javascript" src="./assets/js/common.js"></script>
</body>

Ich habe meine Funktion in common.js definiert und in der Datei main.85741bff.js aufgerufen.

common.js (Funktion)

document.addEventListener("DOMContentLoaded", function (event) {
     masonryBuild();
     navbarToggleSidebar();
     navActivePage();
});

Das Problem ist, dass ich die Funktion aufrufen kann, während die Seite neu geladen wird, die Funktion jedoch nicht, während der Inhalt geladen wird.

Kann mir jemand helfen, dieses Problem zu lösen? Jede Hilfe wäre dankbar.

3
Milan

Sie können Javascript in der Anwendung Angular verwenden.

Schritt 1. Erstellen Sie die Datei demo.js im Ordner assets/javascript .

export function test1(){
    console.log('Calling test 1 function');
}

Schritt 2. Erstellen Sie die Datei demo.d.ts im Ordner assets/javascript .

export declare function test1();

Schritt 3. Verwenden Sie es in Ihrer Komponente

import { test1 } from '../assets/javascript/demo'; 
 @Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor() {
    console.log(test1());
  }
}

Hinweis: Der Dateiname von js und .d.ts sollte gleich sein.

9
Akshay Garg

Im Angular4, 5-Projektordner befindet sich die .angular-cli.json-Datei.

In der Datei sehen Sie 

"apps": [
  {
    "scripts": []
  }
]

Schieben Sie Ihren externen js-Dateipfad in das Array.

0
Songwon Park

Sie müssen die Reihenfolge ändern, in der Sie Ihre JavaSciprt-Dateien laden. Laden Sie common.js vor main......js. Ihr Skript versucht, von einer noch nicht geladenen Datei auf eine Funktion zuzugreifen. Wechseln Sie einfach diese beiden Codezeilen: 

<body>
  <app-root></app-root>
  <script type="text/javascript" src="./assets/js/common.js"></script>
  <script type="text/javascript" src="./assets/js/main.85741bff.js">/script>
</body>
0
VTodorov