Как открыть вкладку в angular 8

Question

Я пытаюсь открыть вкладку, открывая ссылку на элемент tabs, но не работает. Как я могу получить доступ к моей ссылке на вкладки элемента. Функция selectTab уже написана. Если мы передадим вкладку, ссылка на элемент откроется. Но это не работает. Если кто-нибудь знает, пожалуйста, помогите решить эту проблему.

Если я использую ngif, я получаю selectTab неопределенную проблему.

app.component. html:

<tabs #main>
<tab #subone>Content</tab>
<tab #subtwo>Content</tab>
</tabs>

<button (click)="opentab1()">Sub One</button>
<button (click)="opentab2()">Sub Two</button>

app.component.ts:

@ViewChild('main') main: ElementRef;
@ViewChild('subone') subone: ElementRef;
@ViewChild('subtwo') subtwo: ElementRef;

opentab1(){

 this.main.selectTab(this.subone);

}

opentab2(){

 this.main.selectTab(this.subtwo);

}

Демонстрация: https://stackblitz.com/edit/angular-tabs-example-n8qv2e?file=src / app / app.component.ts

Answer 1

почему бы просто не использовать * ngIf?

<div *ngIf="tab==1">Content</div>
<div *ngIf="tab==2">Content</div>


<button (click)="opentab(1)">Sub One</button>
<button (click)="opentab(2)">Sub Two</button>

ts:

opentab(num) {
    this.tab=num; 
}

Answer 2

Это зависит от того, чего вы хотите достичь

Вы можете использовать:

window.open(this.url)

сзади.

Или использовать маршрутизацию в angular, если вы означает, что:

app-routing.modules.ts :

{
    path: 'component/:id', component: your_component
}

компонент. html:

target="_blank" [routerLink]="['/component', '/']"

Или просто используя события:

html

(a (click)="goToLink("www.example.com")">example</a)

ts

goToLink(url: string) {
    window.open(url, "_blank");
}

Или кодирование непосредственно предыдущий:

(a href="https://www.example.com/" target="_blank">example</a)