Опция динамического выбора мата в массиве форм

Question

У меня есть динамическая группа форм.

Образец пользовательского интерфейса изображения

Оба mat-select являются динамическими. Когда я нажимаю кнопку добавления, он добавляет еще один массив формы с такими же элементами и такими же динамическими полями.

В первом индексе массива группы форм, когда я изменяю значение mat-select в столбце CATEGORY, он заполняет столбец JOB в соответствии со значениями, извлекаемыми из базы данных.

Моя проблема в том, что, когда я добавляю другой массив группы форм, mat-select все еще динамичен, но когда я изменяю значение mat-select во 2-й строке, столбец CATEGORY, он меняет все строки в столбце JOBS. основываться на данных выборки в первом столбце.

HTML-файл

<mat-form-field>
  <mat-select formControlName="categories" 
          (selectionChange)="getJobs($event.value)">
              <mat-option *ngFor="let cat of categories" 
                 [value]="cat.jobCatID">
                {{cat.name}}
              </mat-option>
  </mat-select>
</mat-form-field>
<mat-form-field>
   <mat-select formControlName="jobs">
          <mat-option *ngFor="let job of jobs" [value]="job.jobID">
            {{ job.name}}
          </mat-option>
   </mat-select>
 </mat-form-field>

файл TS

getJobs(id){
return this.category.getJob(id).subscribe(
  data => {
      if(data.success){
        this.jobs=data.jobsCat.jobs
      }
  }
)}

в любом случае, я могу сделать переменную jobs динамической, чтобы различные переменные объектов с одинаковыми значениями в ngFor для каждого выбора JOBS mat-select?

Answer 1

Все хорошо сейчас.Я только что сделал задания в массив.

jobs:any[]=[];

объявил это так.Затем fetch использовал индекс в качестве параметра для динамического массива.