Sicherer Navigationsoperator für asynchrone Observable und Pipe in Angular 2

Question

Ich stoße auf ein Problem, bei dem ein Nullwert (anstelle eines Arrays von Lectures) an eine Pipe übergeben wird, wenn der sichere Navigationsoperator auf einer Async geladenen Observablen verwendet wird :

<div *ngFor="let lecture of ((lecturesObservable | async)?.lectures | lectureType: 'main')" class="list-group-item"> 

Lecture-type.pipe.ts

import { Pipe, PipeTransform } from '@angular/core'; 

import { Lecture } from './lecture'; 

@Pipe({name: 'lectureType'}) 
export class LectureTypePipe implements PipeTransform { 
    transform(allLectures: Lecture[], lectureType: string): Lecture[]{ 
     return allLectures.filter(lecture => lecture.type==lectureType); 
    } 
} 

die Vorträge werden durch gut ohne das Rohr iteriert, sobald sie von Async geladen werden. Ist das nur etwas, mit dem ich in ng2 leben muss?

Answer 1

Die asynchrone Pipe wird von Entwurf auf null aufgelöst, wenn ihre beobachtbare Eingabe noch keinen Wert hat. Sie müssen also damit leben, indem Sie Ihre Pipe so gestalten, dass sie einen Null-Input verarbeitet.

Answer 2

Sie können auch zum Beispiel eine BehaviorSubject verwenden, die einen Standardwert liefert, so dass Angular nicht wirft, wenn noch kein Wert empfangen wurde.