我知道有类似的问题,但我仍然无法让它工作..
所以我想用slick.js所以我下载了文件并将其放在我的 Angular 应用程序的 Assets 文件夹中
我导入了我的库
angular.cli.json
"styles": [
"./assets/scripts/slick-1.8.0/slick.css",
"./assets/scripts/slick-1.8.0/slick-theme.css"
],
"scripts": [
//jQuery imports above
"./assets/scripts/slick-1.8.0/slick.min.js"
]
然后在我的组件中...
import { Component, OnInit, Injector } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import * as Slick from '../../../../assets/scripts/slick-1.8.0/slick/slick.min.js';
@Component({
selector: 'app-di-type2',
templateUrl: './di-type2.component.html',
styleUrls: ['./di-type2.component.scss']
})
export class DiType2Component extends AppComponentBase implements OnInit {
public constructor(
injector: Injector
) {
super(injector);
}
ngOnInit() {
const slideContainer = document.querySelector('.slider');
slideContainer.slick({
autoplay: true,
autoplaySpeed: 3500,
});
}
}
从我读到的关于将外部 javascript 库导入 Angular 应用程序的内容来看,这应该可行。我在 vscode 中收到一个错误,提示 [ts] Property 'slick' does not exist on type 'Element'.any
然后在我的控制台中我得到了
如有任何帮助,我们将不胜感激!
谢谢!
最佳答案
使用 Node 和 NPM 安装 Slick.js
npm install slick-carousel --save
安装此 npm 后,它将作为依赖项保存在 package.json 文件中。
然后导入 Slick:
import 'slick-carousel';
someElement.slick();
关于javascript - 尝试在 Angular 5 中使用外部 Javascript 库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48531714/