typescript - Parametrii interogării Angular ca tip boolean, nu string

Aș dori să transmit un parametru de interogare unui *ngIf, dar acesta continuă să fie evaluat ca adevărat deoarece este de tip șir. Cum pot să schimb parametrul meu de interogare într-un boolean pentru a fi evaluat ca fals?

Parametrul de interogare este ?paywall=true, dar este încă adevărat cu interogarea ?paywall=false

component.ts

ngOnInit() {
    this.paywallQuery$ = this.route.queryParamMap.pipe(map(params => params.get('paywall')));
}

component.html

<div *ngIf="(paywallQuery$ | async)"> <-- always evaluates as true
</div>

Răspuns #1

Mapează valoarea la un boolean prin efectuarea unei comparații de șiruri cu 'true'.

ngOnInit() {
  this.paywallQuery$ = this.route.queryParamMap.pipe(
    map(params => {
      const value = params.get('paywall');
      return value ? value.toLocaleLowerCase() === 'true' : false;
    })
  );
}

Răspunsul #2

Dacă deja depind de CDK-ul Angular, aș folosi funcția de coercare booleană (coerceBooleanProperty) pentru a converti acel șir într-un boolean corespunzător.

Este destul de simplu, dar asta e problema cu URL-urile și atributele în spațiul componentelor web față de folosirea JavaScript pentru a face legătura. queryparams, pathparams și attributes sunt toate valori de tip string, așa că trebuie să le convertești ca să aibă sens în implementarea ta.

Acesta ar fi codul meu:

import { coerceBooleanProperty } from '@angular/cdk/coercion';
this.paywallQuery = coerceBooleanProperty(this.route.snapshot.paramMap.get('paywall'))

și poți vedea câteva exemple aici: https://github.com/angular/components/blob/master/src/cdk/coercion/boolean-property.spec.ts