1

所以我有两个组件，HomePageComponent 和 StudentsViewComponent。在 HomePageComponent 我有一个输入标签：

<input type="text" #careerObj class="modules" placeholder="Career Objective ( software engineer)">
<button class="submit" routerLinkActive="active" [routerLink]="['/students', careerObj.value  ]">Search</button>

我想使用参数将此输入的值传递给 studentsViewComponent。

它重定向到正确的路线，但参数为空。该值始终为空，我不确定为什么。

这是我的路线：

  {
    path: 'students/:searchQuery',
    component: StudentsViewComponent
  },

ngOnInit() {
  this.activatedRoute.params.subscribe((params: Params) => {
    console.log(params);
  });
}

不知道为什么参数是空的。

请帮忙

4

1 回答 1

4

首先，routerlink 指令存在按钮类型问题，正如我最后在 github 上看到的那样，您使用元素引用将值传递给路由器链接指令使用官方模型绑定方式 routerlink 可能其中一个导致问题。试试这个，

 <input type="text" [(ngModel)]="route" class="modules" placeholder="Career Objective ( software engineer)">
 <button class="submit" routerLinkActive="active" [routerLink]="['/students', route]">Search</button>

或者

 <input type="text" [(ngModel)]="route" class="modules" placeholder="Career Objective ( software engineer)">
 <button class="submit" (click)="navigate()">Search</button>

并使用此功能是组件

navigate(){
 this.router.navigate(["students", this.route]);
}

不要忘记注入路由器

于 2017-03-14T22:35:42.553 回答