提交搜索表单后的角度重定向

Question

我正在开发一个 SpringBoot 和 Angular 5 Web 应用程序，其中标题中有一个搜索表单：

<div class="searchDiv float-right">
<form (ngSubmit)="onsubmit()" >
<input class="searchBtn searchBtnHeader" type="text" role="search" placeholder="Search..." title="search field">
<button class="fa fa-search align-middle searchBtn searchIcone" type="submit" [routerLink]="['/search']"></button>
</form>
</div>

如何在 Angular 5 中重定向到更详细的搜索页面(组件(？

Answer 1

在onSubmit()方法中，可以添加编程重定向，如下所示

constructor(private router: Router) { }
onSubmit() {
// some stuff
this.router.navigate(['/search']);
}

因此，您不再需要提交按钮中的[routerLink]属性。

有关 Angular 5 重定向的完整指南，请查看此详细教程

Answer 2

从 onsubmit(( 方法以编程方式路由

在课堂上

import { Router } from '@angular/router';
...
constructor(private router: Router) {}
...
onsubmit() {
this.router.navigate(['/search']);
}