如何根据另一个angular下拉列表选择的条件删除和添加下拉值？

<div *ngFor="let filterCondition of filters;  index as i">
  <!-- OUTPUT PROPERTY -->

    <ng-container *ngTemplateOutlet="filterView == 'subscription'? attrs: map; context: { index: i }"></ng-container>


  <!-- CONNECTOR CONDITION -->
  <div>
    <div>
      <select [(ngModel)]="filters[i].op">
        <option *ngFor="let val of op" [value]="val">{{val}}</option>
      </select>
    </div>

  </div>
  <!-- INPUT -->
  <ng-container *ngTemplateOutlet="filterView != 'subscription'? attrs: map; context: { index: i }"></ng-container>
  <!-- SELECT -->
  <div>
    <select *ngIf="!(i==filters.length-1)" [(ngModel)]="filters[i].logop" (change)="operatorChange(filters[i])">
      <option *ngFor="let val of logop" [value]="val">{{val}}</option>
    </select>

  </div>
  <!-- ICONS -->

  <div>
    <button *ngIf="i==filters.length-1" (click)="addStateConditionRow()"><i
        aria-hidden="true"></i></button>
    <button *ngIf="i>0" (click)="deleteStateConditionRow(i)"><i
       ></i></button>
  </div>
</div>

<ng-template  #attrs let-i="index">
  <div>
    <ng-container *ngIf="!dataProps">
      <input type="text" [(ngModel)]="filters[i].value">
    </ng-container>
    <ng-container *ngIf="dataProps">
      <select [(ngModel)]="filters[i].value">
        <option *ngFor="let data of dataProps" [value]="data.attrId">{{data.attrName}}</option>
      </select>
    </ng-container>
  </div>
</ng-template>

<ng-template  #map let-i="index">
  <div>
    <input type="text" clickOutside (clickOutside)="closeAccordion($event)" (click)="openAccordion($event)" [(ngModel)]="filters[i].attribute">
    <div *ngIf="showAccordion">
      <app-common-accordion-mapping [filterInputRef]="filterInputRef" [inputAttributes]='inputAttributes' ></app-common-accordion-mapping>
    </div>
  </div>
</ng-template>