Question

我有适用于所有页面的HeaderComponent，并显示在每个页面上。因此，我为标题创建了单独的组件，并使用选择器将其添加到app.component.html中。我创建了两个子页面“ Home”和“ Second”，并在app.component.ts

中使用<router-outlet>对其进行路由

路线

const routes: Routes = [{
  path : "", component : HomeViewComponent
},{
  path : "second/:id/:category", component : SecondComponent
}];

我正在第二个组件中传递参数id和类别。

在HeaderComponent中，我想在路由更改时获取此参数，因此我在 header.component.ts

中执行了以下代码

constructor(private router: Router, private route : ActivatedRoute) { }

  ngOnInit() {
    this.router.events.subscribe((val) => {
      // see also 
      this.route.params.subscribe(params => {
        console.log(params);
      });
    });
  }

但是，我无法获得参数。我在控制台中收到{}个空参数我也附加了stackblitz链接。

https://stackblitz.com/edit/hardik?file=app%2Fapp.routing.module.ts

更新：我在所有页面中都有此标头组件，而不仅仅是第二个组件。所以我不能只将它放在第二个组件中。

Answer 1

使用<ng-select [items]="skills" [(ngModel)]="user.skills" bindLabel="label" bindValue="WONT LET ME TO BIND VALUE" [multiple]="true" name="skills[]"> </ng-select>

paramMap

如何在Angular 6中的Common组件中获取参数值

1 个答案: