如何在 Angular 2 中包含 JQuery 插件？

Question

我在 angular 2 项目 Link

中安装了 jquery 插件

npm i jquery-bootstrap-scrolling-tabs

并加入 .angular-cli.json

 "styles": [
        "styles.css",
        "../node_modules/jquery-bootstrap-scrolling-tabs/dist/jquery.scrolling-tabs.css"
      ],
      "scripts": [
        "../node_modules/jquery/dist/jquery.js",
         "../node_modules/jquery-bootstrap-scrolling-tabs/dist/jquery.scrolling-tabs.js"
      ],

我宣布名副其实的typings.d.ts

declare var scrollingTabs:any;

在app.component.ts

中使用

ngAfterViewInit() {
    $('.nav-tabs').scrollingTabs({
      scrollToTabEdge: true  
    });
  }

错误：TypeError: __WEBPACK_IMPORTED_MODULE_1_jquery___default(...)(...).scrollingTabs is not a function

Answer 1

您忘记添加 jquery 变量

declare var $ : any

有关如何添加 jquery 的更多信息，请使用此 LINK 有无打字

Answer 2

在您的组件文件中导入 jquery。

declare let $ : any

如何在 Angular 2 中包含 JQuery 插件？

How to include JQuery plugins in Angular 2?

typescript

angular2-directives

angular-cli

angular