组件之间的数据发送不起作用

Question

我有 2 个组件，我想将一个字符串的值从一个组件发送到另一个组件。我不知道为什么它不起作用。

我就是这样做的：

组件 1（来自）：

export class UsersComponent {
  constructor(
      private cvPage: CvPageComponent
    ) {}
  onSubmit(){
    this.cvPage.cvData = doc.output("datauristring");
  }
}

doc.output 给出一个字符串。 cvPage 组件也在 app.module.ts 的提供者中。在这个函数打开另一个组件之后。

组件 2（到）：

export class CvPageComponent implements OnInit {
  public cvData: any;

  ngOnInit() {
      console.log(this.cvData);
    }
}

在控制台中我可以看到，变量仍然是undefined。谢谢你的帮助:)

Answer 1

Demo 如果没有相关组件，您可以使用服务来完成，如果父子组件使用 @Input。在演示中，它们都是可用的。

像这样写服务

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
@Injectable()
export class DataService {

  private paramSource = new BehaviorSubject("default message");
  sharedParam = this.paramSource.asObservable();

  constructor() { }

  changeParam(param: string) {
    this.paramSource.next(param)
  }

}

在组件中 pu 这个服务在 costructors 中

constructor(private _dataService: DataService) { }

然后在第一个组件集合中

 this._dataService.changeParam("your parameter")

在第二个组件中读起来像

this._dataService.sharedParam.subscribe(param=>console.log(param))

---

但如果您在新标签页中打开，则可以通过路由器传递参数

approuting.module.ts 改为

 { path: "cv/:param", component: CvPageComponent },

然后在 users.component.ts 中

window.open(cvurl+'/'+your_parameter, "_blank");

在 csv.component.ts 中导入 costructor

private route: ActivatedRoute

从url读取参数

let param=this.route.snapshot.paramMap.get('param');