How to call JavaScript functions from Typescript in Angular 5?

Ravi Kumar B picture Ravi Kumar B · Mar 28, 2018 · Viewed 76.7k times · Source

I'm working on PDF Viewer development in Angular 5. I'm done with writing HTML code for the UI part. Now I've JavaScript files that provide functionality for the UI elements. As Angular 5 supports typescript for implementing functionality for UI components, I want to include JavaScript files in Angular Project and call them from my Typescript code.

Questions:

  1. How and where to include JavaScript Files in Angular Project?
  2. How to call the JavaScript Functions from Typescript class?

It would be great if anyone provides me an example !!

Thanks in Advance!!

Answer

Arun Raj R picture Arun Raj R · Mar 28, 2018

1. How and where to include JavaScript Files in Angular Project?

You need to include your JS file in the asset folder and refer this JS file in .angular-cli.json file.

Refer the snapshot's,

Folder structure should be like this.

enter image description here

.angular-cli.json

enter image description here

2. How to call the JavaScript Functions from Typescript class?

your TS should be like this.

myJsFile.js file content.

enter image description here

This sample logic mentioned above will work, I have tried and tested using version 4, So I am expecting it to work with version 5 also.

Please see the GitHub repo (Angular8)