angular - 为什么在 Angular 中更改路由时 javascript 不加载？

Question

我正在使用 Angular 8 构建一个 Angular 应用程序，我注意到当应用程序第一次打开时，所有组件都可以正常工作，但是当我更改路由时，javascript 不会再次加载，因此这些路由上的组件不起作用

我已经尝试了以下方法： - 在 angular.json 文件中声明 javascript。-在 index.html 文件中声明脚本。

和

创建服务以动态加载脚本：- https://stackoverflow.com/a/42766146/11067579。

我在 app.component.ts 中调用上述脚本加载服务，如下所示：

import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
import { DynamicScriptLoaderService } from '../app/services/dynamic-script-loader.service';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})


export class AppComponent implements OnInit {
  title = 'Look4Cars';

  constructor(private dynamicScriptLoader: DynamicScriptLoaderService) { }




  ngOnInit() {
    'use strict';
    this.startScript();

  }



  async startScript() {

    await this.dynamicScriptLoader.load('jquery', 'jquery.modernizr', 'jquery-ui.min', 'jquery.queryloader2', 'jquery.fancybox', 'mad.customselect',
      'sticky-sidebar', 'query.themepunch.revolution', 'jquery.themepunch.tools', 'owl.carousel', 'mad.tabs',
      'isotope.pkgd.min', 'instafeed.min', 'elevatezoom.min', 'plugins', 'script', 'bootstrap').then(data => {
        console.log('script loaded ', data);
      }).catch(error => console.log(error));
  }
}

下面是我在 angular.json 文件中设置脚本数组的方式：

               "scripts": [
              "src/assets/js/libs/jquery-2.2.4.min.js",
              "src/assets/js/libs/jquery.modernizr.js",
              "src/assets/js/libs/jquery-ui.min.js",
              "src/assets/plugins/jquery.queryloader2.min.js",
              "src/assets/plugins/fancybox/jquery.fancybox.min.js",
              "src/assets/plugins/mad.customselect.js",
              "src/assets/plugins/sticky-sidebar.js",
              "src/assets/plugins/revolution/js/jquery.themepunch.revolution.min5597.js",
              "src/assets/plugins/revolution/js/jquery.themepunch.tools.min5597.js",
              "src/assets/plugins/owl.carousel.min.js",
              "src/assets/plugins/mad.tabs.js",
              "src/assets/plugins/isotope.pkgd.min.js",
              "src/assets/plugins/instafeed.min.js",
              "src/assets/plugins/elevatezoom.min.js",
              "src/assets/js/plugins.js",
              "src/assets/js/script.js",
              "src/assets/plugins/bootstrap.js"
            ]

更改路线并返回时如何让javascript工作？

标签： angular