Использование ngFor для создания уникальных идентификаторов для элементов

Question

Если у меня есть аккордеон, подобный этому, как бы я использовал индекс, чтобы добавить к data-target и id, чтобы не все элементы раскрывались и сворачивались одновременно?

<div *ngFor="let item of items; let i = index">
<div class="accordion" id="accordion">
    <div class="card">
      <div class="card-header" id="heading">
        <h2 class="mb-0">
          <div class="btn btn-link collapsed"
          data-toggle="collapse"
          data-target="#collapse"
          id = "card-head"
          aria-expanded="false" aria-controls="collapse">
            {{item.name}} {{item.lastName}}
          </div>
        </h2>
      </div>
      <div id="collapse" class="collapse" aria-labelledby="heading"
      data-parent="#accordion">
        <div class="card-body">
            <p>{{item.content}}</p>
            <button class="btn btn-primary btn-sm">Edit</button>
          </div>
      </div>
    </div>
  </div>
</div>