Question

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

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

AND

创建服务以动态加载脚本： -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中更改路线时无法加载JavaScript？

0 个答案: