How to use @ types / jqueryui with angular2 (typescript)

I would like to use jqueryui in my angular application

I can import jquery like this

import * as $ from 'jquery';

But how do I import '@ types / jqueryui' from https://www.npmjs.com/package/@types/jqueryui

Since jqueryui is an interface, I cannot import it

How do I use 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
    }
}
+4
source share
1 answer

Work around: (not a solution via @ types / jqueryui)

You can use @ types / jqueryui for input / autocomplete.

HTML root:

Import jquery and jquery UI js files

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

component:

In component declaration

declare var $:any;

use it in a class like this

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

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

. @types/jqueryui (). , - .

+1

Source: https://habr.com/ru/post/1667605/


All Articles