Hay un cambio reciente introducido en Angular 13 donde la forma anterior de llamar a funciones de javascript desde componentes angulares ya no funciona.

Tengo un problema al llamar a una función de JavaScript desde un componente específico.

Ya probé de la manera habitual y aquí está mi enfoque.

ARCHIVO: src\assets\js\main.js

 (function($) { "use strict"; function animatedProgressBar () { $(".progress").each(function() { var skillValue = $(this).find(".skill-lavel").attr("data-skill-value"); $(this).find(".bar").animate({ width: skillValue }, 1500, "easeInOutExpo"); $(this).find(".skill-lavel").text(skillValue); }); } })(jQuery);

ARCHIVO: src\app\about-me\about-me.component.ts

 import { Component, OnInit } from '@angular/core'; declare function animatedProgressBar(): any; @Component({ selector: 'app-about-me', templateUrl: './about-me.component.html', styleUrls: ['./about-me.component.css'] }) export class AboutMeComponent implements OnInit { //declare animatedProgressBar: any; constructor() {} ngOnInit(): void { animatedProgressBar(); } }

Este fragmento de código arroja un error: ERROR ReferenceError: animationProgressBar no está definida

Revisé la respuesta en este tema de StackOverflow pero no funcionó para mí.

Esperando algunos aportes valiosos sobre este tema.