CODEWITHSUNDEEP
angular
Jeanluca Scaljeri
Jeanluca Scaljeri

Reputation: 29139

Angular 7 app normal anchor link not working

In my angular app, for the url http://example.com/bar-foo I render some (static) HTML which I receive from an API

Inside that content there is this link

<a href="/bar-foo?show=1">Show</a>

So what it does is it add the query parameter to the url. However, and I don't understand why, when I click that link nothing happens

I've tried to reproduce it in a stackblitz without success (because the link works). Any suggestions what the reason might be that this link is not working?

UPDATE: If a bit of debugging, I noticed that when I click the not-responding link it does trigger something inside zonde.js

enter image description here

which I think will call that callback which does event.preventDefault(). I'm not sure why zonejs does this in my case

Upvotes: 0

Views: 981

Answers (3)

Philip
Philip

Reputation: 94

Maybe the static HTML was (unintentionally) encoded/escaped/sanitized during the process of fetching it from the API and injecting it into the angular component?

Could you please provide more details / code snippets about how exactly your app fetches and injects the static HTML with the nonfunctional link?

Upvotes: 1

Prakash Harvani
Prakash Harvani

Reputation: 1041

  • if You write like '?show=1' after the path so it can consider as query parameters
  • **you can try (click)="showHtml()" inside anchor tag and call API. **

and function like this

showHtml(){
//---API Code And result render it on html page
}

Upvotes: 1

canmustu
canmustu

Reputation: 2649

You added this route in Stackblitz. Did you add this route in your project too ?

const appRoutes: Routes = [
  { path: 'test', component: TestComponent }
];

And there should be an error on your browser console. Can we get that error message ?

And also you must use routing like this:

<a [routeLink]="['/bar-foo']" [queryParams]="{show:'1'}">Show</a>

Upvotes: 1

Related Questions