Angular material not displaying the selectionChange event

I am get issue in angular material not displaying selectionChange

<!-- Customer Dropdown -->
<mat-form-field appearance="fill" class="customer-dropdown">
 <mat-label>Select Customer</mat-label>
 <mat-select (selectionChange)="onCustomerChange($event.value)">
   <mat-option *ngFor="let customer of customers$ | async as customers" [value]="customer.id">
     {{ customer.name }}
   </mat-option>
 </mat-select>
</mat-form-field> 

 customerWithFilter$ = this.customerWithProjects$.pipe(map(customers =>
    customers.filter(customers => customers.id  == this.selectedCustomerId )

  ));

  filterProjects(): void {
     this.customerWithFilter$ 
  }

  onCustomerChange(customerId: number): void {
     customerId = this.selectedCustomerId ;
    this.filterProjects();
  }

customerwithfilter observable works properly.

Thanks for the suggestions murali, I found the issue in customer.first_name argument.

    <mat-form-field appearance="fill" class="customer-dropdown">
    <mat-label>Select Customer</mat-label>
    <mat-select (selectionChange)="onCustomerChange($event.value)">
      <mat-option *ngFor="let customer of customers$ | async as customers" [value]="customer.id">
        {{ customer.first_name }}
      </mat-option>
    </mat-select>
  </mat-form-field>