ionic - как получить следующий ключ от объекта в html

Question

 <ion-fab right bottom>
                  <button ion-fab (click)="goForward(key)"><ion-icon name="arrow-round-forward"></ion-icon></button>
                </ion-fab>

Из html-файла я хочу передать следующий ключ объекта в функцию goForward().

Я получаю ключ из цикла, как показано ниже в html-файле

<div *ngFor="let product of user">
    <div padding="10px" *ngFor="let key of keys(product)" >
         <div *ngIf="product[key]!=Object && key=='ProductDetails'">

            <h6 *ngFor="let key2 of keys(product[key])">
              <div *ngIf="key2!='url'">
              {{key2}} &nbsp; : &nbsp; {{product[key][key2]}}
              <ion-fab right bottom>
                  <button ion-fab (click)="goForward(key)"><ion-icon name="arrow-round-forward"></ion-icon></button>
                </ion-fab>
        </div>
      </h6>       
    </div>     
  </div> 
  </div>

И файл JSON

{
  "results": [
    {
      "ProductDetails": {
        "ProductName": "Macintosh Apples",
        "ProductId": "Mac3323",
        "Price": "$233",
        "url": ""
      },
      "Producer": {
        "ProducerName": "John's Apple Farm",
        "Product Place": "Texas USA",
        "ProductId": "Mac3323",
        "Harvest date": "13/2/2009",
        "State_in": "DISPATCHED",
        "State_out": "DELIVERED",
        "Dispatched Date": "15/2/2009"
      },
      "Distributer": {
        "DistributerName": "John's Distribution", 
        "ProductId": "Mac3323",
        "Arrival Date": "20/2/2019",
        "State": "DISPATCHED",
        "State_out": "DELIVERED"
      },
      "Warehouse": {
        "WareHouse Name": "John's Warehouse",
        "ProductId": "Mac3323",
        "ArrivalDate": "21/2/2019",
        "State_in": "DISPATCHED",
        "State_out": "IN_TRANSIST"
      },
      "Retailer": {
        "Retailer Name": "John's Retailers",
        "ProductId": "Mac3323",
        "State_in": "IN_TRANSIST",
        "State_out": "IN_TRANSIST"
      }
    }
  ]
}

Answer 1

Попробуйте добиться этого с помощью индекса:

 <div padding="10px" *ngFor="let key of keys(product);index as i" >
         <div *ngIf="product[key]!=Object && key=='ProductDetails'">

            <h6 *ngFor="let key2 of keys(product[key])">
              <div *ngIf="key2!='url'">
              {{key2}} &nbsp; : &nbsp; {{product[key][key2]}}
              <ion-fab right bottom>
                  <button ion-fab (click)="goForward(keys[i+1])"><ion-icon name="arrow-round-forward"></ion-icon></button>
                </ion-fab>
        </div>
      </h6>       
    </div>     
  </div>