How to install and use jQuery in Angular 6

November 20, 2018

First run

$ npm install jquery –save

This will add jquery to the package list and make it a dependency. Next in your componentname.component.ts file add

import * as $ from ‘jquery’;

jQuery has now been added to the component and can be used from this location. Write all jQuery within the ngOnInit() { } function and you will now see it running on your page.

Example component.ts file:

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

  selector: 'app-componentname',
  templateUrl: ‘./componentname.component.html',
  styleUrls: ['./componentname.component.scss']
export class ComponentnameComponent implements OnInit {
  constructor() { }
  ngOnInit() {
    $(document).ready(function () {

Stay in Touch!

Subscribe to our newsletter.

Solutions Architecture

browse through our blog articles

Blog Archive