En utilisant un tableau D'objet Observable avec ngFor et Async Pipe Angular 2

j'essaie de comprendre comment utiliser les Observables en angle 2. J'ai de ce service:

import {Injectable, EventEmitter, ViewChild} from '@angular/core';
import {Observable} from "rxjs/Observable";
import {Subject} from "rxjs/Subject";
import {BehaviorSubject} from "rxjs/Rx";
import {Availabilities} from './availabilities-interface'

@Injectable()
export class AppointmentChoiceStore {
    public _appointmentChoices: BehaviorSubject<Availabilities> = new BehaviorSubject<Availabilities>({"availabilities": [''], "length": 0})

    constructor() {}

    getAppointments() {
        return this.asObservable(this._appointmentChoices)
    }
    asObservable(subject: Subject<any>) {
        return new Observable(fn => subject.subscribe(fn));
    }
}

C'BehaviorSubject est poussé à de nouvelles valeurs, comme si à partir d'un autre service:

that._appointmentChoiceStore._appointmentChoices.next(parseObject)

je m'abonne à elle sous la forme d'une observable dans le composant que je veux l'afficher dans:

import {Component, OnInit, AfterViewInit} from '@angular/core'
import {AppointmentChoiceStore} from '../shared/appointment-choice-service'
import {Observable} from 'rxjs/Observable'
import {Subject} from 'rxjs/Subject'
import {BehaviorSubject} from "rxjs/Rx";
import {Availabilities} from '../shared/availabilities-interface'


declare const moment: any

@Component({
    selector: 'my-appointment-choice',
    template: require('./appointmentchoice-template.html'),
    styles: [require('./appointmentchoice-style.css')],
    pipes: [CustomPipe]
})

export class AppointmentChoiceComponent implements OnInit, AfterViewInit {
    private _nextFourAppointments: Observable<string[]>

    constructor(private _appointmentChoiceStore: AppointmentChoiceStore) {
        this._appointmentChoiceStore.getAppointments().subscribe(function(value) {
            this._nextFourAppointments = value
        })
    }
}

Et la tentative de les afficher dans la vue de la manière suivante:

  <li *ngFor="#appointment of _nextFourAppointments.availabilities | async">
         <div class="text-left appointment-flex">{{appointment | date: 'EEE' | uppercase}}

cependant, les disponibilités ne sont pas encore une propriété de l'objet observable donc il y a des erreurs hors, même pensé que je le définir dans les disponibilités à l'interface de la manière suivante:

export interface Availabilities {
  "availabilities": string[],
  "length": number
}

Comment puis-je afficher un tableau de façon asynchrone à partir d'un objet observable avec la pipe async et *ngFor? Le message d'erreur que je reçois est:

browser_adapter.js:77 ORIGINAL EXCEPTION: TypeError: Cannot read property 'availabilties' of undefined