CODEWITHSUNDEEP
angularng-bootstrapangular-ng-ifngx-bootstrap-accordion
Manuel Fodor
Manuel Fodor

Reputation: 494

Angular 17 ngIf accepts boolean only?

I had a working Angular app and now it seems that there is a breaking change and *ngIf accepts only boolean values, not casting falsy/truthy values to boolean.

However, I could not find anything in docs, nor with internet search, so, it seems if I were the only one experiencing this. But then I have no idea how/why this is happening.

<pre><code>{{ arr?.length }}</code></pre>

<pre *ngIf="arr?.length">has length (value)</pre>
<pre *ngIf="!!arr?.length">has length (bool)</pre>
<pre *ngIf="!arr?.length">has no length (bool)</pre>

rendered UI

Upvotes: 1

Views: 167

Answers (1)

Manuel Fodor
Manuel Fodor

Reputation: 494

Turned out it wasn't Angular itself but it was within an NgBootstrap Accordion component and I did not wrapped my content with <ng-template> inside ngbAccordionBody.

wrong:

...
<div ngbAccordionBody>
    <pre *ngIf="arr?.length">has length (value)</pre>
</div>

correct:

...
<div ngbAccordionBody>
  <ng-template>
    <pre *ngIf="arr?.length">has length (value)</pre>
  </ng-template>
</div>

This seems over-engineered to me, but that's out of scope. Finally, it works.

Upvotes: 1

Related Questions