0

I've got a component that downloads data from an API. When the user clicks Search, the content from the API is fetched via AJAX. This content from the API is in JSON and has got an ID of the product inside. I am able to create new HTML elements based on this content and put them inside my site, but I would like every created on the fly element to have routerLink="/detailsPage/itemID" working, so that after clicking it would route to detailsPage with apropriate ID. How to do it in the most simple way? I assume some recompiling of refreshing is needed.

Maciej Dobosz
  • 148
  • 1
  • 12
  • if you want it as a param you can do something like this: [routerLink]="['/detailsPage']" [queryParams]="{id: itemId}" – yer May 11 '18 at 18:34
  • Generally `routerLink="/detailsPage/itemID` works for me with a static content. But with AJAX it doesn't work. – Maciej Dobosz May 11 '18 at 18:37
  • can you show the response you are getting from api call – yer May 11 '18 at 18:39
  • API i totally fine. The question is am I just missing something or adding any `routerLink` to an element made after page loads won't work? – Maciej Dobosz May 11 '18 at 19:40

1 Answers1

-1

The answer to this question is HTTPClient - Angular offers it as an easier way to use XMLHttpRequest (AJAX) in Angular applications, and using it also makes sure that routerLink or any other Angular directives will work on objects created dynamically with this method. Angular - HTTPClient

Maciej Dobosz
  • 148
  • 1
  • 12