Question

我想在我的角度应用程序中使用jqueryui

我可以像这样导入jquery

import * as $ from 'jquery';

但我如何导入＆＃39; @ types / jqueryui＆＃39;从 https://github.com/bcit-ci/CodeIgniter/issues/904

由于jqueryui是一个界面，我无法导入它

我如何使用jquery

 export class JqueryUIIntegrationComponent implements AfterViewInit{
        @ViewChild('jqueryElement') el:ElementRef;
        constructor() {
        }

    ngAfterViewInit() {
        console.log(this);
        $(this.el.nativeElement).slideUp(4000).slideDown(5000); // jquery function
        $(this.el.nativeElement).draggable(); //Since jqueryui is not imported this will not work
    }
}

Answer 1

解决方法：（不是 @ types / jqueryui 的解决方案）

您可以使用 @ types / jqueryui 输入/自动完成支持。

根HTML：

导入jquery和jquery UI js文件

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>

<强>组件：

在你的组件声明

declare var $:any;

在课堂上使用它

export class JqueryUIIntegrationComponent implements AfterViewInit {
    @ViewChild('jqueryElement') el:ElementRef;
    constructor() {
    }

    ngAfterViewInit() {
        console.log(this);
        $(this.el.nativeElement).draggable(); //same old style
    }
}

注意：欢迎通过 @ types / jqueryui （正确方式）提供任何原生支持。如果您找到任何解决方案，请告诉我。

Answer 2

在您的 *.ts 文件之上添加对 d.ts 类型文件的引用

///<reference path="../node_modules/@types/jqueryui/index.d.ts"/>

它对我有用。

我如何使用@ types / jqueryui和angular2（typescript）

2 个答案: