无法将可观察的组件从 Angular 中的一个组件传递给另一个组件

Question

我有两个组件:change-request-details.component其中是edit-change-request-details-dialog.component。我试图将一个Observable类型的对象从change-request-details.component传递到edit-change-request-details-dialog.component。在change-request-details.component.ts(父组件)中，我定义了这个变量:

result$: Observable<ChangeRequest>;

在ngOnInit()中被分配了一个Obervable

this.result$ = this._projectRequestService.findByChangeId(this.changeId);

在我的子组件edit-change-request-details-dialog.component中，我尝试用这种方式检索:

@Input() result$: Observable<ChangeRequest>;
ngOnInit(): void {
/*
this.result$
.pipe(tap((temp) => (this.changeRequest = temp)))
.subscribe();
*/
/*
this.result$
.pipe(
tap((data: ChangeRequest) => {
this.changeRequest = data;
console.log('selectedChangeRequest inside function', this.changeRequest);
})
)
*/
this.result$.subscribe((resp) => {
this.changeRequest = resp;
console.log('details', this.changeRequest);
});

}

的所有三个方法都失败了，在控制台(F12)中，我可以看到以下错误消息:

ERROR TypeError: Cannot read property 'subscribe' of undefined
at EditChangeRequestDetailsDialogComponent.ngOnInit (edit-change-request-details-dialog.component.ts:75)
at callHook (core.js:3038)
at callHooks (core.js:3008)
at executeInitAndCheckHooks (core.js:2960)
at refreshView (core.js:7187)
at refreshEmbeddedViews (core.js:8281)
at refreshView (core.js:7196)
at refreshComponent (core.js:8327)
at refreshChildComponents (core.js:6965)
at refreshView (core.js:7222)

当我在其他方法中使用pipe时，错误消息说属性'pipe'未定义。

我不明白为什么它给我一个错误。你能告诉我如何将Object从一个组件传递到另一个组件吗?谢谢你。

Answer 1

你可以尝试在输入的getter中订阅而不是在ngOnInit

@Input() get result$(value: Observable<ChangeRequest>){
value.subscribe((resp) => {
this.changeRequest = resp;
console.log('details', this.changeRequest);
});
} ;