javascript - 如何在Angular/Angular2/Angular4应用程序中导入和使用particles.js

我有一个Angular应用程序，想在其中使用particles.js，但是我不知道如何添加它并使它正常工作。

我已将其添加到.angular-cli.json

  "scripts": [
    "../node_modules/particles.js/particles.js"
  ],

我已经将它导入了我的组件

import * as  particlesJS from 'particles.js';

并尝试使用初始化它

  particlesJS.load('particles-js', 'assets/particles.json', function() {
    console.log('callback - particles.js config loaded');
  });

有人有这个工作吗？

最佳答案

这样做的方法如下:

只需在您的index.html(cdn或本地)中导入particles.js

<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>

将div anchor 放入组件模板中(也可以将其放在index.html或其他地方)

<div id="particles-js"></div>

通过添加简单的类型定义(在您的组件中或在typesings.d.ts中)使包可见。

declare var particlesJS: any;

在ngOnInit(或其他地方)中对其进行初始化

particlesJS.load('particles-js', 'particles.json', null);