angular7 material mat-selectと他のコントロールのmat-autocompleteの連動

angular7 materialを使用しています。初心者なので基本的なところが抜けていたらすみません。
親キーとなる項目をmat-selectで選択すると他のコントロールのmat-autocompleteの値をDBから取得し切り替えたいのですがうまくいきません。(reactive formを使用しています）
省略部分もありますが以下のような実装です。
auto-completeに値はセットされて一見正常に動いているようには見えるのですが、
タイムラグ？なのか親キー項目を取得したあとに
auto-completeが瞬時に入れ替わりません。前回のものが残ってしまいます。
イベント自体は呼んでいます。

---- Component --------
  onSelectParent(parent: Parent) {
// これを入れるとselectもauto-completeも両方動か無くなります。
//    if (this.isParentSelected) {
//      this.formGroup.get('parent').reset();
//    }
    this.isParentSelected = true;
    this.parent_id = parent.id;

    // this.filteredItems = [];
    // this.defaultItems = [];
    this.getChildren();
  }

  getChildren() {
    this.childrenService.getChildren(this.parent_id).subscribe(
      (items: Array<Child>) => {
      this.defaultItems = items;
      this.formGroup
      .get('parent').valueChanges.pipe(
          startWith(null),
          map((value: string) => this.filterItems(value)))
          .subscribe(itemsFiltered => {
          this.filteredItems = itemsFiltered;
      });
    });
  }

<!-- Parent Keys -->
<mat-form-field>
  <mat-select placeholder="Office" #parentlist formControlName="parent" required>
    <mat-option *ngFor="let p of parents" (onSelectionChange)="onSelectParent(p)" [value]="p.name">
      {{p.name}}
    </mat-option>
  </mat-select>
</mat-form-field>

<!-- Child items -->
<mat-form-field class="full-width">
  <input matInput placeholder="Children" aria-label="Children" [matAutocomplete]="childAutocomplete" formControlName="children" required>
</mat-form-field>

<mat-autocomplete #childAutocomplete="matAutocomplete" isOpen="isParentSelected">
  <mat-option *ngFor="let c of children" [value]="c.name">
      {{c.name}}
  </mat-option>
</mat-autocomplete>