Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

3.1K
Vistas
How to call JavaScript functions from Typescript in Angular 5?

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!!

over 4 years ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

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.

Updating the answer for the new Angular version release. Working perfectly till version 11.2.6.

Find the code (function with parameter) here for Angular11

over 4 years ago · Santiago Trujillo Denunciar

0

The given answer by Arun Raj R is perfect.

But for the angular 6+ project you need to take angular.json instead of angular-cli.json.

also if you want to pass parameter inside external function that come from js file than use just function name.

For Ex :

app.component.ts

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
declare function myfunction: any; // just change here from arun answer.

@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.scss']
})
export class TestComponent implements OnInit {
    constructor() { }

    ngOnInit() { 
        myfunction('test1', 'test2');
    }
};

yourJs file :

function myfunction(params1, params2) {
    console.log('param1', params1);
    console.log('param2', params2);
}
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda