为什么我不能分配和使用组件内的值?

时间:2017-03-02 05:05:56

标签: angular typescript components

我有一项服务,可以按如下方式在组件之间共享变量,

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中使用它。

1 个答案:

答案 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 ...
            });