How to add a external javascript library file to a specific component in Angular version 7

Question

How to add a external javascript library file to a specific component in Angular version 7

558 views Asked by Trần Văn Thành At 20 February 2019 at 01:45

I'm a newbie with Angular framework. While I trying to create a HTML template using Angular version 7. I fall in to a problem about javascript library. My template has a lot a page such as home, about, product, etc... At a home page, I need to display a slide using jquery.slidey.js library. I'm using script tag to add the library into home.component.html but the library is not loaded. So the question is How can add a external javascript into a specific Angular component. Thanks in advance

You can see all my source at My GitHub source code

Original Q&A

There are 3 answers

**holydragon** · Answer 1 · 2019-02-20T01:55:32+00:00

holydragon On 20 February 2019 at 01:55

See this. The link shows how to install, setup, and import JQuery library into an Angular project with details and images you can easily follow. There is also a working demo in at the bottom.

**Hang Tu** · Answer 2 · 2019-02-20T06:10:54+00:00

This is how I resolved it.

Index.html

<head>
 ...
 <link rel="icon" type="image/x-icon" href="favicon.ico">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

HomeComponent.ts

 import { Component, OnInit } from '@angular/core'
 declare var $: any;


export class HomeComponent implements OnInit {

  constructor(private appService: AppService) { }

  ngOnInit() {
  }

  doSomething() {
    $("p").hide(); //example
  }

}

**Ankush Jain** · Answer 3 · 2019-02-20T06:17:17+00:00

First, install this package npm install jquery-slider

Now, open angular.json file & add below styles & scripts.

"styles": [ "./node_modules/jquery-slider/..CSS File Path", ], "scripts": [ "./node_modules/jquery-slider/...JS File Path" ]

TechQA.

How to add a external javascript library file to a specific component in Angular version 7

There are 3 answers

Related Questions in JAVASCRIPT

Related Questions in ANGULAR

Related Questions in SLIDY

Popular Questions

Popular Tags

Trending Questions