jquery ui - @types/jqueryui'yi angular2 (typescript) ile nasıl kullanabilirim?

Angular uygulamamda jqueryui kullanmak istiyorum

jQuery'yi böyle içe aktarabilirim

import * as $ from 'jquery';

Ama '@types/jqueryui' paketini https://www.npmjs.com/package/@types/jqueryui adresinden nasıl içe aktarabilirim?

jqueryui bir arayüz olduğu için, onu içe aktaramıyorum

jQuery'yi nasıl kullanıyorum

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

Cevap #1

Çözüm Yolu: (@types/jqueryui üzerinden çözüm değil)

Yazım/otomatik tamamlama desteği için @types/jqueryui kullanabilirsiniz.

Kök HTML:

Jquery ve jquery UI js dosyalarını içe aktar

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

Bileşen:

Bileşeninizde ilan edin

declare var $:any;

sınıfta bunu böyle kullan

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

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

Not: @types/jqueryui aracılığıyla herhangi bir yerel destek (doğru yol) memnuniyetle karşılanır. Eğer herhangi bir çözüm bulursanız lütfen bana bildirin.

Cevap #2

*.ts dosyanızın üstüne d.ts türler dosyasına referans ekleyin

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

Benim için işe yaradı.

İlgili makaleler