routerLink in angular для отображения html-страницы в новом окне

Question

Мое текущее приложение выглядит так.Если я нажимаю «Предсказать», я хочу, чтобы приложение открыло новую HTML-страницу и распечатывает ее содержимое.

Но когда я нажимаю «Предсказать», URL-адрес обновляется.до

http://localhost:4200/predict

и содержание в

Forext.html

добавляется на экран 1.

Я хочу отображать только содержимое из файла предиката.html, когда я нажимаю предикат.

Вот мой файл app.component.html, в который я включил routerLink для прогнозирования

 <div style="padding-top:30px;padding-left:350px;">                                
 <a routerLink = "predict" >Predict</a>                               
</div>                              
 <router-outlet></router-outlet>

Я добавил следующее в свой файл app.module.ts

import { RouterModule} from '@angular/router';
imports: [
    RouterModule.forRoot([
      {
         path: 'predict',
         component: PredictionComponent
      }
   ])
  ],

Answer 1

здесь вы просто добавляете target="_blank" в anchor тег и затем проверяете

, если это не сработает, тогда вы можете просто добавить click handler и связать любой метод, например goToPredictPage на anchorвместо использования routerLink

<div style="padding-top:30px;padding-left:350px;">                                
 <a (click)="goToPredictPage()" >Predict</a>                               
</div>                              
 <router-outlet></router-outlet>

в вашем файле ts добавьте ручную маршрутизацию, которая откроет страницу маршрута в новой вкладке

goToPredictPage(){
    this.router.navigate([]).then(result => { window.open(`/predict`, '_blank'); });
}

здесь this.router является экземпляром Router

так что добавьте это в конструктор ts файла

constructor(public router: Router) { }