角-水平步进器(步骤内的部件总是被初始化)

Question

父组件.ts文件

 <mat-stepper #stepper labelPosition="bottom">
    <mat-step label="Search">
        <app-search-component></app-search-component>
    </mat-step>
    <mat-step label="Detail">
        <app-detail-component></app-detail-component>
    </mat-step>
<mat-stepper>

我使用角度步进和两个步骤，使用单独的组件(搜索和详细信息)。在搜索组件上搜索后，希望将搜索结果传递到详细信息页上。我正计划通过

1. 当我单击搜索数据行(显示在表格式上的搜索结果)时，我使用第二个组件(Detail组件)上的简单服务
2. 将这些数据保存到变量中，ngOnInit我想检索这些数据。

但问题是当我加载页面时，两个组件一起初始化，

是否只有在单击搜索结果行时才能初始化第一个组件，而不是第二个组件？

谢谢

是否只有在单击搜索结果行时才能初始化第一个组件，而不是第二个组件？

Answer 1

我对此做了一些研究，看起来该组件有一个名为selectionChange的输出属性，它在每次更改步骤时都会发出一个事件。

https://material.angular.io/components/stepper/api#MatStepper https://github.com/angular/components/issues/7259

话虽如此，如果你这样做了：

<mat-stepper #stepper labelPosition="bottom" (selectionChange)="doSomething($event)">
    <mat-step label="Search">
        <app-search-component></app-search-component>
    </mat-step>
    <mat-step label="Detail">
        <app-detail-component></app-detail-component>
    </mat-step>
<mat-stepper>

您应该能够处理该事件，并将必要的信息作为输入属性传递给detail组件，这样您就不需要每次运行ngOnInit。

我知道它破坏了整个使用服务在兄弟姐妹之间传递数据的想法，这是一种更基于反应的方法(将状态向上移动)，但它可以工作。