Как обновить селектор?

У меня есть 2 компонента: компонент A и компонент B, компонент A вызывает компонент B через селектор, app-team-users — это селектор, он вызывает данные из API, а затем заполняет их в таблице, которая работает отлично.

В Компоненте A я назвал селектор компонента B, в Компоненте A у меня есть функция, где я создаю пользователя или сохраняю пользователя.

Как нам обновить или вызвать селектор app-team-users, чтобы, если я сохраню пользователя из компонента A, обновилась таблица в компоненте B, которая будет обновляться app-team-users? потому что они являются отдельным компонентом. Может у кого есть идеи или просветления? Большое тебе спасибо. Добрый день.

#Компонент A сохраняет код пользователя

  saveUser() {
    if(this.createUserForm.valid) {
      this.accountService.create(this.createUserForm.value).pipe(
        finalize(() => {
          this.isInProgress = false;
        })
      ).subscribe({next: (res) => { this.notificationService.showSuccess('User has been created successfully.');
          //if user is created refresh the selector
        },
        error: (err) => {this.notificationService.showError('Something went wrong, Try again later.');
          this.isInProgress = false;
        },
        complete: () => {
          this.isInProgress = false;
        },
      });
    }  
  }

таблица app-team-users

#Код для вызова селектора Компонент A

  <form [formGroup]="modelForm" >
            <app-team-users [selectedNewUser] = "newUsers" [selectedTransactionTeam]="modelForm.value.teams"
                [selectedTransactionUser]="modelForm.value.users" (transactionUserEvent)="transactionUserEvent($event)"
                (transactionTeamEvent)="transactionTeamEvent($event)">
            </app-team-users>
        </form>

код #app-team-users

  ngOnInit(): void {
    this.transactionUserTable.dataSource = new MatMultiSortTableDataSource(this.sort, this.CLIENT_SIDE);
    this.transactionUserTable.nextObservable.subscribe(() => { this._transactionUserPageEvent(); });
    this.transactionUserTable.sortObservable.subscribe(() => { this._transactionUserPageEvent(); });
    this.transactionUserTable.previousObservable.subscribe(() => { this._transactionUserPageEvent(); });
    this.transactionUserTable.sizeObservable.subscribe(() => { this._transactionUserPageEvent(); });
  }

private _transactionUserPageEvent() {
    this.isTransactionUserLoading = true;
    this.transactionUserTable.data = [];
    this._userProfileService.getUserProfileTableDropdown(
      this.accountId,
      this.transactionUserTable.pageIndex + 1,
      this.transactionUserTable.pageSize,
      this.searchTransactionUserInput.nativeElement.value,
      this.transactionUserTable.sortParams,
      this.transactionUserTable.sortDirs
    )
      .pipe(
        finalize(() => this.isTransactionUserLoading = false)
      )
      .subscribe({
        error: err => this._notificationService.showError(err),
        next: res => {
          this.transactionUserTable.totalElements = res.totalItemCount;
          this.transactionUserTable.data = res.items as UserProfileDropdownDto[];
          this.totalData = res.totalItemCount;
          this.currentDisplayedData = res.lastItemOnPage;
        },
        complete: noop
      });
  }