我正在开发一个使用Angular 11的项目,我们想要使用Bootstrap 5原生JS,而不使用像ng-bootstrap、MDB或ngx-bootstrap这样的第三方库(我们也不使用jQuery)。我知道在TS上使用JS库并不理想。
问题是如何在Angular的TS组件中导入Bootstrap JS并使用其对象和方法。
最初我认为安装以下软件包就足够了:
npm i bootstrap@next
npm i @types/bootstrap
这两个文件已在package.json
中导入,并且可以在node_modules
中找到。我还在angular.json
中导入了"scripts": [ "node_modules/bootstrap/dist/js/bootstrap.js" ]
,但我仍然无法使用它们。
例如,如果我执行以下操作:
import { Carousel } from 'bootstrap';
...
carousel: Carousel | any;
...
this.carousel = document.getElementById('video-carousel')
this.carousel.interval = false;
'bootstrap'
是指 '@types/Bootstrap'
。轮播图不应该自动循环,但是它确实这样做了。 每种 Bootstrap 类型都会出现此问题。