javascript - 如何在 Angular 6 中运行第三方 JS 脚本

Question

我在具有 $(document).ready 功能的 Angular 应用程序中有一些第三方 JS 脚本，在开始时一切正常，但是当我通过 routerLink 更改路由时，某些功能不起作用，但是当重新加载页面时它可以工作。

我尝试在 angular.json 和 index.html 中导入 JS 文件。

如果您对此问题有任何解决方案，请提供帮助。

谢谢。

Answer 1

发生这种情况是因为页面已完全加载一次，然后在您导航路线 (SPA) 时仅重新加载页面的一部分。因此，该$(document).ready事件仅在页面加载时触发一次。

实现此目的的解决方法是在某些角度生命周期中自行触发第三方脚本，例如，角度路由器NavigationEnd事件：

this.router.events.subscribe(event => {
  if (event instanceof NavigationEnd) {
     // do your stuff here
  }
});

但这很糟糕，很容易失控。如果您将第三方库封装在某个 Angular 组件（例如指令）中以避免$(document).ready模式，这可能会更好。