jquery-ui - 我如何将 @types/jqueryui 与 angular2( typescript )一起使用

Question

我想在我的 Angular 应用程序中使用 jqueryui

我可以这样导入jquery

import * as $ from 'jquery';

但是我如何从导入'@types/jqueryui' https://www.npmjs.com/package/@types/jqueryui

由于 jqueryui 是一个接口(interface)，我无法导入它

我是如何使用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(正确的方式)提供任何 native 支持。如果您找到任何解决方案，请告诉我。