Ionic 5 and nested array

Hi everybody,

I have a problem using a nested array in Ionic 5, I have to create it after retrieving data from my backend service.

I can correctly display the data, the hide/show works, but I have several problems:

• when I change segment or hide the item divider, my value is reset to 1.
• when I’m using “ngModel”, changing the value [0][0] change the value [1][0] too.
• when I’m using “value” my array doesn’t change when I try to save it.

Here is the code

this.nestService.getMultiples(listParam)
  .subscribe((data) => {
       this.arrayOne = _.orderBy(data[0], ['Name'], ['asc']);
        this.arrayTwo = _.orderBy(data[1], ['Name'], ['asc']);

        this.arrayTwoModified = this.arrayTwo;
        this.arrayTwoModified.forEach(item => item.numberSelect = 1);

        this.arrayOneModified = this.arrayOne;
        this.arrayOneModified.map(i => {
          i.show = true;
          i.arrayTwoModified = this.arrayTwoModified;
        });     
  });

And this is the template

 <div *ngSwitchCase="'One'">
  <ion-item-group *ngFor="let arrayOne of arrayOneModified; let i= index">
    <ion-item-divider tappable (click)="arrayOne.show = !arrayOne.show" color="medium">
      <ion-label>{{arrayOne.Name}}</ion-label>
      <ion-icon slot="end" *ngIf="arrayOne.show" name="arrow-down-outline"></ion-icon>
      <ion-icon slot="end" *ngIf="!arrayOne.show" name="arrow-up-outline"></ion-icon>
    </ion-item-divider>
    <ion-list *ngIf="arrayOne.show" lines="full">
      <ion-item *ngFor="let arrayTwo of arrayOne.arrayTwoModified ; let j= index">
        <ion-label>{{arrayTwo.Name}} - {{i}} - {{j}}</ion-label>
        <ion-input class="right" type="number" min="0" [(ngModel)]="arrayTwo.numberSelect"></ion-input>
        <!-- <ion-input class="right" type="number" min="0" [(ngModel)]="arrayOneModified[i].arrayTwoModified[j].numberSelect"></ion-input> -->
        <!-- <ion-input class="right" type="number" min="0" [(value)]="arrayOneModified[i].arrayTwoModified[j].numberSelect"></ion-input> -->
      </ion-item>         
    </ion-list>
  </ion-item-group>
</div>

If anybody have an idea, it will be nice!
Thanks

1 post - 1 participant

Read full topic