问题是<a> tag in Angular

时间:2018-08-11 18:58:26

标签: angular angular-routerlink

I am using Angular to develop Router features, so here it is my data coming from JSON as like, and below footer.html where using *ngFor is using to repeat list json list.details. But in ng-container, I`m not using any href attribute but in the image (attached) you can see there some value embedded dynamically and for this my router is not working :

details: {
    icon: "fa fa-google-wallet  light-blue-text",
    ref: "",
    name: "PIM",
    routeslink: "certificate"
}

But the problem is when router change url it is reflecting on html, which I don`t want. enter image description here

的href属性
<ul class="no-list-bullet">
    <li *ngFor="let items of list.details">
<i class="{{items.icon}}"></i> 
<a target="_blank" href="{{items.ref}}" *ngIf="items.ref !== '';else second">{{items.name}}</a>
<ng-template #second>
   <ng-container><a [routerLink]="[items.routeslink]" href="javascript:void()">{{items.name}}</a></ng-container>
   </ng-template>

2 个答案:

答案 0 :(得分:1)

您需要将链接设为绝对

<ng-container><a [routerLink]="['/', items.routeslink]">{{items.name}}</a></ng-container>

答案 1 :(得分:-1)

使用routerlink时,无需添加href 您可以像这样直接使用

<a [routerLink]="['/', items.routeslink]">{{items.name}}</a>