Use jQuery with Angular

yarn add jquery
yarn add @types/jquery --dev

angular.json

"scripts": [
  "node_modules/jquery/dist/jquery.min.js"
],

app.component.html

<div #divBox style="width: 40px;height: 40px;background-color: blue;">

</div>

app.component.ts

import {AfterViewInit, Component, ElementRef, ViewChild} from '@angular/core';
import * as $ from 'jquery';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements AfterViewInit {
  title = 'myapp';
  @ViewChild('divBox') divBox: ElementRef;

  ngAfterViewInit(): void {

    setTimeout(() => {
      $(this.divBox.nativeElement).hide();
    }, 3000);

  }
}

References
https://www.npmjs.com/package/jquery
https://stackoverflow.com/questions/42919161/selecting-template-element-and-passing-to-jquery-in-angular-2-component
https://stackoverflow.com/questions/30623825/how-to-use-jquery-with-angular

Related