javascript - Check if an Angular dependency is in use

Question

I have combined angular and jQuery together, working with them due to the fact that I got a UI template which was originally built with jQuery.

Everything works fine but I have this challenge. We know that when using jQuery, or generally JavaScript, event binding takes place when the element which you want to bind an event is present at the time the script is being loaded. But we know that elements related to data which are fetched over an API are not present until the component is loaded. Take for instance using an ngFor to iterate over a collection of users fetched over an API but the call completes after the component has already loaded.

How I've managed to get over this problem since angular loads the component before the API call to fetch any data from the database takes place, I now use the afterViewInit() so that the required scripts can bind events when data has fetched and the required elements are present. Unfortunately, when the network is not fast, the scripts load before the data is being fetched and then events are not bound. For instance a custom select input.
Proposal
I have proposed a way to curb this behavior by waiting for the HttpClient class to finish performing it's operations before I load the scripts.
Question
How can I check to know if the instance of the injected HttpClient is in use or not so that I can take further decisions from there?

question from:https://stackoverflow.com/questions/65887665/check-if-an-angular-dependency-is-in-use

Answer 1

Waitting for answers