我有一个问题,在我的路由器选项卡中,只在链接上单击右键工作。如果单击链接下方或周围,则选项卡会切换,但路径不会。并且这个视图选项卡是空白的,我认为在链接中路由器是可以的,但是tab的周围是一个事件javascript。
<tabset >
<tab>
<ng-template tabHeading>
<a class="routing_link" [routerLink]="['/VariablesParamCrear']" >Asociar</a>
</ng-template>
</tab>
<tab [active]="tabset" >
<ng-template tabHeading>
<a class="routing_link" [routerLink]="['/VariablesParamCrear']">Crear</a>
</ng-template>
<h1>Hola putitos</h1>
</tab>
<tab>
<ng-template tabHeading>
<a class="routing_link" [routerLink]="['/VariablesOrder']">Ordenar</a>
</ng-template>
</tab>
<tab>
<ng-template tabHeading>
<a class="routing_link" [routerLink]="['/VariablesFilter']">Filtrar</a>
</ng-template>
</tab>
尝试在组件中放入一个方法并在选项卡本身上单击(单击),如下所示:
import {
Component,
OnInit
} from '@angular/core';
import {
Router
} from '@angular/router';
@Component({
selector: 'app-my-component',
templateUrl: './my-component.component.html',
styleUrls: ['./my-component.component.less']
})
export class MyComponentComponent implements OnInit {
constructor(private router: Router) {}
ngOnInit() {}
goToLink(link: string): void {
this.router.navigateByUrl(link);
}
}
<tabset>
<tab (click)="goToLink('/VariablesParamCrear')">
<ng-template tabHeading>
Asociar
</ng-template>
</tab>
<tab [active]="tabset" (click)="goToLink('/VariablesParamCrear')">
<ng-template tabHeading>
Crear
</ng-template>
<h1>Title</h1>
</tab>
<tab (click)="goToLink('/VariablesOrder')">
<ng-template tabHeading>
Ordenar
</ng-template>
</tab>
<tab (click)="goToLink('/VariablesFilter')">
<ng-template tabHeading>
Filtrar
</ng-template>
</tab>
</tabset>