如何根据if条件替换离子项目中的文本

Question

I have a button on click of which a pop up with some values appear and after selecting a value that selected value based on conditions gets populated in ion-item, the issue is the ion-item value based on conditions instead of getting replaced a new ion-item cell is added.

I'm new to ionic so couldn't identify what mistake im doing.

<ion-label style="margin-bottom:10px; font-size:15px;" color="basic" stacked>{{field.label}}</ion-label>
<button ion-item block color="basic" (click)="getOulistData(field.name,field.value)">Tap to choose</button>

<div *ngFor ="let x of ouHierarchy">
    <div *ngIf = "field.name ===x.level">
        <ion-item>{{x.value}}</ion-item>
    </div>
</div>

<div>
    <ion-item *ngIf="field.value">
        {{field.value}}
    </ion-item>
</div>```

Answer 1

Change this:

  <ion-item *ngIf="field.value">
  {{field.value}}
</ion-item>

Into this:

  <ion-item *ngIf="field.name != x.level">
  {{field.value}}
</ion-item>

By doing the above, you will have one ion item, if the first ion item condition is not satisfied then this ion item will appear.