-1

I have difficulty converting routerLink in href.

 <a [routerLink]="['/pick',{id:sizzle.parameter,type:food}]"

I tried, but its giving me error

<a [href]="'/pick'+id:sizzle.parameter+type:food"
user12707940
  • 131
  • 2
  • 5
  • 16
  • 1
    if you want to use router, then you have to use `routerLink` not `href` – Michael Kang Dec 16 '20 at 21:53
  • I am having data load issue with routerLink, so I want to use href – user12707940 Dec 16 '20 at 21:54
  • pixelbits is correct: `if you want to use router, then you have to use routerLink not href`. The ` – paulsm4 Dec 16 '20 at 22:00
  • 1
    @user12707940 This is an [XY problem](https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem). If you're having trouble getting `routerLink` to work, you should ask about that, not about what you think the solution is. – John Montgomery Dec 16 '20 at 22:21
  • Okay so here's the thing, in my project there is one angular component which contains 2 tabs on the header. For each header there is different data. When click on 1st tab data is displayed properly, but when click on 2nd tab data is not rendered. On refresh of the page I get the data for 2nd tab. That is the reason I am planning to use href – user12707940 Dec 16 '20 at 22:28

1 Answers1

2

You should use routerLink for that. For example like this:

 <a [routerLink]="['/pick']" [queryParams]="{id: 1, food: 'pizza'}">Touch me</a>
XRaycat
  • 1,051
  • 3
  • 16
  • 28
  • You mean `href` in place of `routerLink` right? – user12707940 Dec 16 '20 at 22:09
  • 3
    I mean. Dont use href in Angular. Unless you want to acces an external site e.g. stackoverflow – XRaycat Dec 16 '20 at 22:11
  • 1
    @user12707940 `href` will be created automatically when using `routerLink` – Ploppy Dec 16 '20 at 22:22
  • Okay so here's the thing, in my project there is one angular component which contains 2 tabs on the header. For each header there is different data. When click on 1st tab data is displayed properly, but when click on 2nd tab data is not rendered. On refresh of the page I get the data for 2nd tab. That is the reason I am planning to use href – user12707940 Dec 16 '20 at 22:28
  • Can you show your code? You can make tabs in different ways. For example i prefer using Angular Material for that which is a very neat library for e.g. tabs and ALOT of other useful stuff. see more at https://material.angular.io/components/tabs/overview – XRaycat Dec 16 '20 at 22:33
  • Yes I am using angular material. Give me few minutes, ill share with you – user12707940 Dec 16 '20 at 22:35
  • Here's the Link - https://screenrec.com/share/DOg8Gcps3l. I am currently using `routerLink`, instead of routerLink if I use href then page reloads and I get data for `2nd tab Qualifier` – user12707940 Dec 16 '20 at 22:52
  • You need to show your code or give us some more context. Otherwise, it's difficult to give you a good answer :) So now I'm just guessing.and trying to give you an general answer. If you want component 1 to commucate with component 2, it's normal to use a service and communicate with observables, e.g. a Subject. This service can also contain a state for example about which body part the user is looking on. If it should be possible to refresh your site without starting over again, a solution could be to cache some information in the user's browser with localStorage or indexdDb – XRaycat Dec 16 '20 at 23:07
  • Okay, yes I can share my code, but there are many files. Do you want remote access? – user12707940 Dec 16 '20 at 23:22
  • 1
    No thank you :) I think you should try to create a minimal example in for example stackblitz. Then you should think about what the exact problem is - and then create a new question here on Stack overflow with enough code/context to fully understand your problem. – XRaycat Dec 16 '20 at 23:40