-1

I have a boolean valued input property in an Angular 12 app that looks like this:

  @Input()
  isTOSAccepted: boolean = false

And in the template I'm attempting to set the value like this:

[isTOSAccepted]="oftrue | async">

The oftrue property is declared like this:

oftrue:Observable<boolean> = of(true)

The template linter creates the following error:

Type 'boolean | null' is not assignable to type 'boolean'.
  Type 'null' is not assignable to type 'boolean'.ngtsc(2322)

Thoughts?

Ole
  • 41,793
  • 59
  • 191
  • 359
  • 1
    "Thoughts?" isn't exactly a high quality question. The value emitted by an AsyncPipe is initially null, but the typing already told you that. – jonrsharpe May 30 '21 at 21:55
  • Also note research is required. Did you read e.g. https://stackoverflow.com/q/61681239/3001761, https://stackoverflow.com/q/59249409/3001761, ...? – jonrsharpe May 30 '21 at 22:02
  • @jonrsharpe you're right. I remember you telling me and I was searching for the question ... but I think it got cleaned up or something ... Anyways hopefully this stays in place ... otherwise you might see me back here in a few days :) – Ole May 30 '21 at 22:04

1 Answers1

2

The output for AsyncPipe is T | null, so you will possibly need to handle a default value like:

{{ (oftrue | async) || false }}

The linter is complaining because your input is of type boolean and the async pipe returns the union type of T and null

Felipe Bonfante
  • 692
  • 5
  • 18