jQuery bxSlider插件在Angular 4中不起作用

Question

我是Angular 5 Framework的初学者。我已经创建了一个项目并正在处理它，但我遇到了bxSlider的问题。我在myangular项目中添加了一个bxSlider插件。它首先加载似乎没问题。但是，当我点击其他页面链接并返回我的索引页面时，bxSlider插件无效。

1）这是cutsom.js文件。

$(document).ready(function($) {

$('.homeSlider').bxSlider({
    speed: 1500,
    pause: 5000,
    mode: 'fade',
    captions: true,
    auto: false,
    infiniteLoop: true,
    stopAuto: false,
    pager: false,
    nextSelector: '#slider-next',
    prevSelector: '#slider-prev',
});

}）;

2）app.component.ts文件

declare var jquer:any;
declare var $:any;

我在组件文件中声明了jquery和$ object。

当网站加载时，它看起来像这样。

在我更改页面并返回我的索引页面后，整个滑块都会崩溃。

Answer 1

将代码从custom.js移动到组件文件中的ngOnInit() {}生命周期方法。无论何时加载组件，它都会初始化滑块。无需编写文档就绪功能。