Question

我每次都为Multi-Item Carousel Advance- 1个项目制作一个Angular项目，并使用JQuery进行同样的操作。考虑到JQuery已正确安装，我得到了$（'。carousel.carousel-multi-item.v-2 .carousel-item'）。each（function（）{}

的编译错误

我已经尝试了很多关于Stack Overflow的研究，但是没有一个答案符合我的问题。我对Angular 4和JQuery还是很陌生，并且仍在尝试理解。我一直在引用的示例仅定义了html和js，而这正是我使用它的方式。以下是我的 team-carousel.component.ts 文件。与此相关的html文件非常简单，但是https://mdbootstrap.com/docs/jquery/javascript/carousel/#multi-item-carousel-v2供参考。

已更新：

export class ResearchLayoutComponent{
  constructor() {
  $('.carousel.carousel-multi-item.v-2 .carousel-item').each(function(){
    var next = $(this).next();
    if (!next.length) {
      next = $(this).siblings(':first');
    }
    next.children(':first-child').clone().appendTo($(this));
    for (var i=0;i<3;i++) {
    next=next.next();
    if (!next.length) {
      next = $(this).siblings(':first');
    }
    next.children(':first-child').clone().appendTo($(this));
  }
 });
}
}

我不确定是否丢失任何内容，因为$将错误显示为预期的[ts]标识符，并且我不知道如何解决它。也许需要一个函数调用？如果没有运行jQuery，则轮播仅一次显示一个图像，而不显示多个图像。任何帮助表示赞赏。谢谢。

Answer 1

请添加此更改。

angular-cli.json

"scripts": [ "../node_modules/jquery/dist/jquery.min.js",

"../node_modules/bootstrap/dist/js/bootstrap.js

angular.json

 "scripts": [ "./node_modules/jquery/dist/jquery.min.js",

    "./node_modules/bootstrap/dist/js/bootstrap.js

现在您需要使用jQuery的地方添加以下代码片段。

import * from 'jquery';

(or)

declare var $: any;

这将解决问题。

有关此主题的更多信息，请单击此处。 https://medium.com/@swarnakishore/how-to-include-and-use-jquery-in-angular-cli-project-592e0fe63176

使用jquery出错：[ts]预期用于$（'。carousel'）。each（function（）{}的标识符

1 个答案: