Angular 角度2+;RxJS-无法读取未定义属性的下一个属性

Angular 角度2+;RxJS-无法读取未定义属性的下一个属性,angular,functional-programming,rxjs,reactive-programming,Angular,Functional Programming,Rxjs,Reactive Programming,我已经创建了下一个组件: export class MonthView { currentMonth: Moment = moment(); currentMonth$: Observable<Moment>; currentMonthObserver: Observer<Moment>; decrement: Function; increment: Function; constructor() { this.currentMonth

我已经创建了下一个组件:

export class MonthView {
  currentMonth: Moment = moment();
  currentMonth$: Observable<Moment>;
  currentMonthObserver: Observer<Moment>;
  decrement: Function;
  increment: Function;

  constructor() {
    this.currentMonth$ = new Observable((observer: Observer<Moment>) => {
      this.currentMonthObserver = observer;
    }).share();

    const decrementCounter$: Observable<Function> = Observable.create((observer) => {
      this.decrement = () => {
        observer.next();
      };
    });

    const incrementCounter$: Observable<Function> = Observable.create((observer) => {
      this.increment = () => {
        observer.next();
      };
    });

    Observable
      .merge(
        decrementCounter$.map(() => - 1),
        incrementCounter$.map(() => + 1)
      )
      .startWith(0)
      .scan((currentCount: number, value: number) => currentCount + value)
      .subscribe((count: number) => {
        this.currentMonthObserver.next(this.currentMonth.clone().add(count, 'M')); //this.currentMonthObserver is undefined
      });
  }
} 

此代码
This.currentMonthObserver=observer输入

this.currentMonth$ = new Observable((observer: Observer<Moment>) => {
   this.currentMonthObserver = observer;
 }).share();

不确定您想做什么,但假设您在查看inc和dec时有按钮,我认为您可以简化一些:

export class MonthView {
  currentMonth$: Observable<Moment>;
  tickMonth$: new Subject<Number>();

  constructor() {
    this.currentMonth$ = tickMonth$
      .scan((myMoment: Moment, tickMonthValue: number) => myMoment.clone().add(tickMonthValue, 'M'))
      .startWith(new Moment());
  }
} 
导出类MonthView{
currentMonth$:可观察的;
tickmount$:新主题();
构造函数(){
此.currentMonth$=tickMonth$
.scan((myMoment:Moment,tickMonthValue:number)=>myMoment.clone().add(tickMonthValue,'M'))
.startWith(新时刻());
}
} 
然后在您的视图中,您可以分别执行
(单击)=“tickmount$.next(1)”
(单击)=“tickmount$.next(-1)”
,以增加和减少月份


然后您只需使用
currentmount | async
来获取您的月份

在我获取异常之前,您能指出一种初始化它的方法吗?我是在一个子组件中订阅它的。我不确定从你的代码中你到底想要完成什么。为了使这一步有效,您需要调用
this.currentMonth.subscribe()。模板上有两个按钮,可以将ui移动到下一个月和上一个月。请看模板(在更新的问题中)似乎有很多模糊,只是递增递减。我想我需要更多关于你想要完成什么的细节。我想从我的答案中添加的内容开始,但我不知道如何继续,因为我不清楚您的要求。我将尝试澄清我自己。想象一个组件,如模板和图像中所示(在更新的答案中)。单击“下一步”按钮应将日历移到下一个月,单击“上一步”按钮应将日历移到上一个月。还有一个子组件正在呈现日历(如模板中所示)。
constructor() {
  this.currentMonth$=new Subject().startWith(0).share();
}

increment() {
  this.currentMonth$.next(1);
}

decrement() {
  this.currentMonth$.next(-1);
}
export class MonthView {
  currentMonth$: Observable<Moment>;
  tickMonth$: new Subject<Number>();

  constructor() {
    this.currentMonth$ = tickMonth$
      .scan((myMoment: Moment, tickMonthValue: number) => myMoment.clone().add(tickMonthValue, 'M'))
      .startWith(new Moment());
  }
}