Subscribe button only works in the second click

Asked

Viewed 53 times

3

I have a button for each row of a grid, which when clicked, calls an subscribe that fills the data of that code clicked inside a modal. This button until it works, but not on the first click, but on the second. But when moving that subscribe into the ngOnInit, the button works at the first click, but when I enter my system the page takes a long time to load. I imagine it’s a waiting time to load the data, but I don’t know how to fix it.

My button calls the function clickDetail()

<a type="button" #modal data-toggle="modal" data-target="#exampleModal" (click)="clickDetail()"></a>

My TS file

clickDetail () {
  this.diarioCarteiraService.getCarteiras(this.codigoCarteira).subscribe(res => {
    this.listaCarteira = res.data;   
  });
}

My Service

getCarteiras(codigoCarteira: number): Observable<ResponseDiarioCarteira> {
  return this.http.get<ResponseDiarioCarteira>(`${this.urlApi}/${'diario- carteira?codigo='}${codigoCarteira}`, super.ObterAuthHeader());
}
  • It would be pertinent to inform more details the question as the modal, as well as some error in the console!

1 answer

0

Seeing your code, I’m guessing there’s some conflict between Angular and Bootstrap. Have you tried not using the <a> tag as toggle for the bootstrap modal? If not, test, maybe this is it.

If this is the problem the solution is to open the modal programmatically, using, for example, the return subscribe of the getCarteiras method.

  • Thanks for the answer, I’ve even tried to use the button, but the same thing happens. Since I’m new in this angular world I didn’t know I could open the modal in subscribe. Can you show me how you do it?

  • See if this link helps you: https://stackoverflow.com/questions/42893918/how-do-i-toggle-bootstrap-4-modal-using-angular2-component-typescript

  • As for the answer, I proposed that you remove all modal classes and attributes from the <a> tag, not use a button, because that way you can know if the problem is in some incompatibility. bootstrap uses the element’s onclick to open the modal, maybe this is conflicting with (click)

Browser other questions tagged

You are not signed in. Login or sign up in order to post.