如何以角度将数据从一条路线传输到另一条路线？ [复制]

Posted 2023-02-22

【中文标题】如何以角度将数据从一条路线传输到另一条路线？ [复制]

【英文标题】：How do i transfer data from one route to another route in angular? [duplicate]

【发布时间】：2020-01-01 15:51:39

【问题描述】：

我正在设置基于 Angular 和 aws-amplify 的用户注册工作流程。在我为新用户注册后，需要一个确认步骤，我想将用户重定向到他需要输入确认码的确认组件。

这是我创建新用户的注册方法：

  signUp() 
    if (this.signUpForm.valid === true) 
      this.auth
        .signUp(this.signUpForm.get('email').value, this.signUpForm.get('password').value)
        .then(data => console.log(data))
        .catch(err => console.log(err));
    
  

而不是简单地记录我想要路由到确认页面的数据。所以最终的结果应该是这样的：

  signUp() 
    if (this.signUpForm.valid === true) 
      this.auth
        .signUp(this.signUpForm.get('email').value, this.signUpForm.get('password').value)
        .then(data => this.router.navigate(['auth/confirm']))
        .catch(err => console.log(err));
    
  

为了处理注册确认，我需要访问代表新创建用户的data 的一些内容。

如何使data 对象在我的目标组件中可访问？

我找到了类似https://github.com/mlabieniec/AngularMaterialPWA/blob/master/partTwo/src/app/auth/confirm-code/confirm-code.component.ts的解决方案

但我不喜欢为此使用角度环境的方法。

【参考方案1】：

这是一篇非常好的文章，介绍了在不同场景中传递数据的几种不同方式。 Chiffie 提到的新方法不包括在内，这也是一种完全可行的方法。 https://angularfirebase.com/lessons/sharing-data-between-angular-components-four-methods/。使用服务共享数据是我个人解决此问题的方式。

【参考方案2】：

https://***.com/a/36835156/10179262 希望这个答案有助于通过路由将数据共享给另一个组件。