Using *ngFor with ng-container and *ngIf

Question

One section of my form contains a set of n radio buttons (we'll set n=3 here) which appear in the template as:

<input type="radio" name="variety" value="11" (click)="update($event)">SomeNameX
<input type="radio" name="variety" value="23" (click)="update($event)">SomeNameY
<input type="radio" name="variety" value="36" (click)="update($event)">SomeNameZ

Below the radio buttons I want to produce one of these when the appropriate SomeName is selected:

<div *ngIf="selected===11">Last updated: Sept 1</div>
<div *ngIf="selected===23">Last updated: Oct 3</div>
<div *ngIf="selected===36">Last updated: Nov 4</div> 

where the date and value for each SomeName are returned from the database. I'm using the following code to do the work:

<ng-container *ngFor="let item of items;">
   <div *ngIf="selected==={{item.id}}">
   Last updated:  {{item.dte}}
   </div>
</ng-container>

This is failing because of the {{item.id}} piece - how can I inject the correct value/id into that position?

Answer 1

Use without the expression

<div *ngIf="selected === item.id">