Javascript 如何将输入值作为参数传递给角度传感器中的路由器

我相信我想做的是琐碎的，但我尝试了很多不同的事情，却无法理解

我有两个组件，

SearchComponent

和

DetailsComponent

，用于显示搜索结果

路由模块：

const routes: Routes = [
{ path: '', component: SearchComponent},
{ path: 'armory/:name', component: DetailsComponent}
];

@NgModule({
imports: [ RouterModule.forRoot(routes) ],
exports: [ RouterModule ]
})

export class AppRoutingModule {}

以及

search.component.html

<form class="form-inline container-fluid">
  <input type="text" id="name" placeholder="Character name..." class="form-control">
  <button (click)="onSearch( ... <!--name should be here-->)" class="btn">
    <span class="fa fa-search"></span></button>
</form>

---

如何获取

名称

输入值并将其作为参数传递给

onSearch（）

如果您想获得name的值，只需将一个引用分配给输入字段，如下所示

#name

。以下是您需要做的：

search.component.html

---

希望有帮助

你用的是什么样的表格？模型驱动还是模板驱动？您能告诉我如何为单选按钮组执行此操作吗？这里是第12行，而不是

onSearch（）

@Asalas77中的

'Feronis'

，这里有一个链接可以解决您的问题：

export class SearchComponent implements OnInit {

constructor(private router: Router) {
}

onSearch(name: string) {
   this.router.navigate(['/armory', name])
}
}

 <form class="form-inline container-fluid">
  <input type="text" id="name" #name  placeholder="Character name..." 
  class="form-control">
  <button (click)="onSearch(name.value)" class="btn">
   <span class="fa fa-search"></span></button>
  </form>