The document contains examples of using Observables in Angular to retrieve and combine data. It shows initializing Observables, subscribing to Observables, using operators like mergeMap and combineLatest to combine multiple Observables, and accessing Observable data in templates using the async pipe.

3. 👇

8. 🎉
🎉

9. 🎉
🎉

14. 😇

25. userInfo: any = {};
ticker: any[] = [];

26. userInfo: UserInfo | null = null;
ticker: Ticker[] = [];

30. const observableData$ = of(3);
const observableDataWithParam$ = (param: number) => of(10 * param);
observableData$.subscribe((res) => {
observableDataWithParam$(res).subscribe((data) => {
console.log(data);
})
});

31. const observableData$ = of(3);
const observableDataWithParam$ = (param: number) => of(10 * param);
observableData$.pipe(
mergeMap(res) => observableDataWithParam(res)),
).subscribe((data) => {
console.log(data);
});

32. const observableData$ = of(3);
const observableData2$ = of(5).pipe(delay(2000));
const observableDataWithParam$ = (param: number) => of(10 * param);
observableData$.pipe(
mergeMap((res) => observableData2$.pipe(
mergeMap((res2) => observableDataWithParam$(res + res2))
)),
).subscribe((data) => console.log(data));

33. const observableData$ = of(3);
const observableData2$ = of(5).pipe(delay(2000));
const observableDataWithParam$ = (param: number) => of(10 * param);
combineLatest(observableData$, observableData2).pipe(
mergeMap(([res, res2]) => observableDataWithParam$(res + res2))
).subscribe((data) => console.log(data));

34. <div>
<p>{{ (userInfo$ | async).id }}</p>
<p>{{ (userInfo$ | async).name }}</p>
<p>{{ (userInfo$ | async).age }}</p>
</div>

35. <div *ngIF=”userInfo$ | async as userInfo”>
<p>{{ userInfo.id }}</p>
<p>{{ userInfo.name }}</p>
<p>{{ userInfo.age }}</p>
</div>