我有一项服务,可以按如下方式在组件之间共享变量,
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
@Injectable()
export class AppMessageQueuService {
checkOutPageParams: Subject<Object>;
constructor() {
this.checkOutPageParams = new Subject<string>();
}
}
我使用此服务将以下参数传递给另一个组件
this.appMsgService.checkOutPageParams.next({
'userId': listItem.userInfo.userId,
'listingId': listItem.listingId,
'event': this.event
});
我可以在调试时看到分配给事件的值,这就是我在第二个组件中获取值的方法,
this.appMsgService.checkOutPageParams.asObservable()
.switchMap((params: Object) => {
let userId = params['userId'];
let listingId = params['listingId'];
this.event = params['event'];
return this.checkOutInforService.getCheckoutDetails(userId, listingId);
}).subscribe((checkoutDetail: CheckoutUserDetail) => {
this.checkoutInfoDetails = checkoutDetail;
});
console.log(this.event) //this returns undefined
我也可以看到分配给事件的值。但是当我在上面的行之后打印一个console.log(this.event)时,它说的是undefiend。
问题是什么?如何将值分配给事件并在组件2中使用它。
答案 0 :(得分:2)
我不确定这是不是最好的方法,但你可以尝试:
import 'rxjs/add/observable/forkJoin'
this.appMsgService.checkOutPageParams.asObservable()
.switchMap((params: Object) => {
return Observable.forkJoin ([
this.checkOutInforService.getCheckoutDetails(userId, listingId),
Observable.of(params)])
}).subscribe((result) => {
this.checkoutInfoDetails = result[0] as CheckoutUserDetail;
this.params = result[1];
... do with params as you wish ...
});