ngFor с индексом

Question

У меня есть массив, который заполняет информацию в представлении с помощью * ngFor, но для каждого из них у меня есть меню, мне нужно поставить индекс для каждого, чтобы я мог открыть информацию меню, соответствующую элементу.Я попытался поместить индекс, однако он возвращает только неопределенное значение.

Код страницы:

<div *ngFor="let aprovacao of lista_aprovacao; let i= index;">
    <ion-card>
      <ion-card-content>
        <ion-grid>
          <ion-row class="opcoes-card" *ngIf="btnAcoes[i]">
            <button ion-button class="btn-historico"><ion-icon name="md-paper"></ion-icon>&nbsp; Histórico</button>
            <button ion-button><ion-icon name="md-attach"></ion-icon>&nbsp; Anexo</button>
            <button ion-button class="btn-editar"><ion-icon name="md-create"></ion-icon>&nbsp; Editar</button>
            <button ion-button color="danger"><ion-icon name="md-trash"></ion-icon>&nbsp;Excluir</button>
          </ion-row>
          <ion-row>
            <ion-col col-2>
              <ion-checkbox class="check-card" [checked]="aprovacao.checked"></ion-checkbox>
            </ion-col>
            <ion-col col-5>
              <ion-label stacked>
                <ion-icon name="calendar"></ion-icon>&nbsp; <strong>Data</strong>
              </ion-label>
              {{aprovacao.DataDespesa}}
            </ion-col>
            <ion-col col-4>
              <ion-label stacked>
                <ion-icon name="ios-cash-outline"></ion-icon>&nbsp; <strong>Valor</strong>
              </ion-label>R$ {{aprovacao.Valor}}
            </ion-col>
            <ion-col col-1 (click)="exibeMenu(i)"> 
              <ion-icon name="md-more" class="ico-more"></ion-icon>
            </ion-col>
          </ion-row>
          <ion-row>
            <ion-col col-12>
              <ion-label stacked>
                <ion-icon name="md-person"></ion-icon>&nbsp; <strong>Usuário</strong>
              </ion-label>{{aprovacao.Usuario}}
            </ion-col>
          </ion-row>
          <ion-row>
            <ion-col col-8>
              <ion-label stacked>
                <ion-icon name="ios-information-circle-outline"></ion-icon>&nbsp; <strong>Natureza</strong>
              </ion-label>{{aprovacao.Natureza}}
            </ion-col>
          </ion-row>
        </ion-grid>
      </ion-card-content>
    </ion-card>
  </div>

Функция, заполняющая данные:

listaAprovacao() {
    this.aprovacaoProvider.listaAprovacao().then((data) => {
      this.lista_aprovacao = data;
    })
  }

Функция, которая скрывает меню:

exibeMenu(n) { //<--------- Undefined
    if (this.btnAcoes[n] === false) {
      this.btnAcoes[n] = true;
    } else {
      this.btnAcoes[n] = false;
    }
  }

HTTP Get, поставщик:

listaAprovacao() {
    let headers = new Headers();
    headers.append('Content-Type', 'application/json; charset=UTF-8');
    headers.append('Authorization', 'bearer ' + this.global.tokenGlobal);
    let options = new RequestOptions({ headers: headers });
    let url = 'http://10.10.10.82:8013/api/v1/administracao/aprovacao/listar/'
      + this.global.numeroEmpresa + "/" + this.global.numeroFilial
      + "/" + this.global.IDGlobal;

    return this.http.get(url, options)
      .toPromise()
      .then((response) => {
        var json_data = (response as any)._body;
        var parsed = JSON.parse(json_data);

        var arr_data = [];

        for (var x in parsed) {
          arr_data.push(parsed[x]);
        }

        return arr_data;
      })
      .catch((error) => {
        var json_error = (error as any)._body;
        var parsed = JSON.parse(json_error);

        var arr = [];

        for (var x in parsed) {
          arr.push(parsed[x]);
        }

        return arr[0];
      });