Question

当我使用Router从组件1向组件2传递值时，我有2个组件。组件1和组件2的导航方法都被重新加载，而不仅仅是组件2重新加载

组件1.ts

ngOnInit() {
  this.getFilter();
}
submit(){
  this.router.navigateByUrl('/home', { skipLocationChange: true });
  setTimeout(() => this.router.navigate(['/category']));
} 
getFilter() {
  this.getFiltersFromLS();
  this.dataservice.getFilter().subscribe(datas => {
  this.filters  = datas;
  });
}

组件1.html

<li *ngFor="let data of label">
   <mat-checkbox   (change)="submit(data.val)"  value="{{data.val}}">
      <span class="attributes"> {{data.value}}</span>
   </mat-checkbox>
</li>

2.ts组件

ngOnInit() {
  this.getcategory();
}
getCategory() {
  this.getFiltersFromLS();
  this.dataservice.getCategory().subscribe(data => {
  this.category  = data;
  });
}

Answer 1

您可以在提交功能中使用以下代码，而不是使用两个路由器导航。这将加载主组件并共享数据skipLocationChange作为查询字符串。

submit(){
  this.router.navigate(['/home', { skipLocationChange: true }]);
}

在事件中从角度6中的另一个组件重新加载特定的组件

1 个答案: