Невозможно прикрепить вложение при загрузке файлов

Question

Я пытаюсь прикрепить файл (doc) к аккордеонам в Angular 7. Но он будет каждый раз прикрепляться к индексу 0.

Объяснение: Я использую аккордеоны, в которых я читаюфайл JSON и в соответствии с этим я печатаю заголовки и часть тела.

, поэтому на каждой части тела мне нужно прикрепить файлы.но проблема в том, что когда я прикрепляю какие-либо файлы, которые он собирается добавить только на первом аккордеоне.

Sample.component.html

  <nb-accordion multi >
   <nb-accordion-item *ngFor="let Data of sampleData;index as i" [attr.data-index]="i" #items1 >
   <nb-accordion-item-header>
      {{Data.topicName}}
   </nb-accordion-item-header>
   <nb-accordion-item-body>
      <div class="uploadfiles">
         <div class="col-lg-2">
            <div class="image-upload">
               <label for="file-input">
               <img src="assets/images/push-pin.png"/>
               </label>
               <input id="file-input" type="file" multiple="multiple" 
                  (change)=uploadFiles($event,Data,i)/>
               {{i}}
            </div>
         </div>
         <div *ngFor="let file of Data.files">
            <div class="row">
               <div class="col-lg-10">
                  <div class="image-dlt">
                     <li id="{{file.name}}">{{file.name}}{{i}} <img src="assets/images/deleteIcon.png" title="Remove Attachment" (click)=deleteFiles(file.name)/></li>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </nb-accordion-item-body>
   </nb-accordion-item>
</nb-accordion>

Sample.component.ts

files: Object = [];
    uploadFiles(e: Event, data, i) {
        console.log("index"+i);
        var target: HTMLInputElement = e.target as HTMLInputElement;
        console.log(target.files);
        //console.log(data.topicName);
        data.files = target.files;
        console.log(data);
        this.files="";
    }

выше прикрепил все мои файлы, закодированные в Angular 7., когда я пытаюсь прикрепить любойдокумент, который будет прикреплен только на первой итерации.

На прикрепленном изображении всего 3 заголовка, и если мы расширяем заголовки или аккордеоны, мы можем добавить несколько документов в каждый аккордеон.но если я попытаюсь добавить документы в аккордеон index = 2, то добавлю в аккордеон index = 0.

Я не знаю, почему это происходит.

Я хочу, если я добавлю какие-либо вложения во второй индексный аккордеон, тогда он должен идти со вторым аккордеоном.

Примечание: index уже написан на заголовке аккордеона с 0, 1 и 2.

Может кто-нибудь помочь мне с этим.Заранее спасибо.