角度：从向导的不同步骤获取数据

Question

想象一下，我们有一个3步骤的向导。

我想知道是否有任何解决方案来从步骤1和步骤2中填充数据以将其显示为步骤3。

每一步是一个不同的组件。我知道Step3必须得到两个输入。我的问题是，如何将数据发送到Step1和Step2上的Step3组件？

任何建议，将不胜感激！

谢谢！

Answer 1

使用共享服务，您可以轻松实现此目的。

不要忘记正确设置所述服务的提供者。

wizard.service.ts

import { Injectable } from '@angular/core'; 

@Injectable() 
export class WizardService{ 

    constructor() { } 

    public void setStep1(){ /*do something*/ } 
    public void setStep2(){ /*do something*/ } 
    public void setStep3(){ /*do something*/ } 

} 

step1.component.ts

import { Component } from '@angular/core'; 
import { WizardService} from './wizard.service.ts'; 

@Component({ 
    ... 
}) 

export class Step1Component 

    constructor(private wizardService: WizarService) { } 

    onClick(){ 
    this.wizarService.setStep1(); 
    } 
}