Использование jQuery UI изменяемого размера в Angular 6

Question

Я получаю element.resizable is not a function ошибку при попытке использовать jQuery UI с изменяемым размером в Angular 6.

Это мой код:

import * as $ from 'jquery/dist/jquery';
import 'jquery-ui-dist/jquery-ui';

@Component({
  selector: 'my-comp',
  template: `<div #element 
        style="width:200px;height:200px;border:1px solid black"></div>`
})
export class MyComponent implements AfterViewInit {

    @ViewChild('element') theElement;

    getElement(){
         return this.theElement.nativeElement;
    }

    ngAfterViewInit(){
           const element = this.getElement();
           element.resizable({ handles: "all" });
    }

}

Как получить селектор из #element и использовать его в resizable?

Answer 1

Вам необходимо привязать jQuery к элементу DOM

$(element).resizable({ handles: "all" });