nycJSorg/angular-presentation

<div class="wrapper">
  <ng-container *ngFor="let item of structure; let i = index">
    <span *ngIf="detailIndex <= i" class="item item-{{ i % 2 }} binary">{{
      item.rawValue
    }}</span>
    <div
      [style.margin-left.vw]="item.nesting * 1"
      *ngIf="detailIndex > i"
      class="detail-item item-{{ i % 2 }}"
      style="display: flex"
    >
      <div
        class="raw-value"
        contenteditable="true"
        (keydown.enter)="update($event, item)"
      >
        {{ item.rawValue }}
      </div>
      <div class="detail">
        <div class="field-header">
          <div style="float: right">{{ item.type }}</div>
          <div>{{ item.name }}</div>
        </div>
        <h3>{{ item.value }}</h3>
      </div>
    </div>
    <button
      (click)="detailIndex = detailIndex + 1"
      *ngIf="detailIndex - 1 === i"
    >
      Next
    </button>
  </ng-container>
</div>