Question

我正在尝试刷新所选标签（假设tab2），但只是我正在为同一个标签获取UI加载，并将其高亮显示到tab1。我没有使用动态路由和引导来刷新角度2中的相同选项卡。

以下是我的参考资料

<a routerLink="/tab1" class="placeholder col-xs-2 item"  (click)="onMenuClick('tab1')" *ngIf="authorizationService.isTab1View">
            <span class="placeholderimg"><i id="tabCust" class="fa fa-users fa-menu-top" [style.color]="tab1Selected"></i></span>
            <p class="placeholdertext">{{ 'MENU.tab1' | translate }}</p>
        </a>

        <a routerLink="/tab2" class="placeholder col-xs-2 item" (click)="onMenuClick('tab2')" *ngIf="authorizationService.isTab2View">
            <span class="placeholderimg"><i id="tabSite" class="fa fa-building-o fa-menu-top" [style.color]="tab2Selected"></i></span>
            <p class="placeholdertext">{{ 'MENU.tab2' | translate }}</p>
        </a>

我是角色2的新人。任何人都可以帮助我解决问题。

Answer 1

在routerLinkActive标记中使用anchor指令，如下所示 -

<a routerLink="/tab1" routerLinkActive="active-link" class="placeholder col-xs-2 item"  (click)="onMenuClick('tab1')" *ngIf="authorizationService.isTab1View">
    <span class="placeholderimg"><i id="tabCust" class="fa fa-users fa-menu-top" [style.color]="tab1Selected"></i></span>
    <p class="placeholdertext">{{ 'MENU.tab1' | translate }}</p>
</a>

<a routerLink="/tab2" routerLinkActive="active-link" class="placeholder col-xs-2 item" (click)="onMenuClick('tab2')" *ngIf="authorizationService.isTab2View">
    <span class="placeholderimg"><i id="tabSite" class="fa fa-building-o fa-menu-top" [style.color]="tab2Selected"></i></span>
    <p class="placeholdertext">{{ 'MENU.tab2' | translate }}</p>
</a>

其中active-link是一个css类，可用于自定义活动锚标记。

使用angular 2动态路由在页面刷新上保持选定的选项卡

1 个答案: