Combine two or more (boolean) observables on single ngIf using async pipe

Question

Without observables I can write the following line in the HTML template:

Answer 1

Jota.Toledo's answer is perfectly fine, however I'd like to follow up on my 'bonus' question of how to access a part of the expression after the ngIf.

Essentially all that I'm doing is to combine two or more observables in the class as Jota.Toledo described. However one observable is not boolean but contains items that need to be available after the ngIf.

Then it is easy to just do the following:

newObs = combineLatest(
  this.itemObs,
  this.boolObs1
  this.boolObs3,
  (item, bool1, bool2) => ((item || bool1) && bool2) ? item : null
);

since we can rely on the truthyness of a non-null object in the ngIf. The ngIf then just looks like

This will of course not work if more than one item is required after the ngIf. In this case you would have to use two ngIfs on nested div sections.