首页 > 解决方案 > 使用 jquery 时出错:[ts] $('.carousel').each(function(){} 需要标识符

问题描述

我正在为 Multi-Item Carousel Advance 制作一个 Angular 项目 - 每次 1 个项目,并使用 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 工作,轮播一次只显示一个图像,而不是多个图像。任何帮助表示赞赏。谢谢你。

标签: javascriptjqueryhtmlangularbootstrap-4

解决方案


请添加此更改。

角-cli.json

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

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

角.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


推荐阅读