Угловая сортировка материала не работает должным образом

Question

У меня есть таблица данных с сортировкой, но сортировка работает, только если я использую одно и то же имя в matCellDef и в переменной шаблона.Пример:

<ng-container matColumnDef="SS_KEY">
  <th mat-header-cell *matHeaderCellDef mat-sort-header> Licenza </th>
  <td mat-cell *matCellDef="let element" class="nome-col"> {{element.SS_KEY}} </td>
</ng-container>

Но если я использую метод, у меня отображаются данные, но сортировка не работает (сортируются только первые два элемента):

<ng-container matColumnDef="cliente">
  <th mat-header-cell *matHeaderCellDef> Cliente </th>
  <td mat-cell *matCellDef="let element" class="nome-col"> {{getCustomerName(element.SS_SC_ID)}} </td>
</ng-container>

этофайл .ts:

ngOnInit() {    
  this.fetchClienti();
}

fetchClienti() {
  this.clientiApi.getCustomers()
    .subscribe(clienti => {
      this.clienti = clienti;
    }, (err) => {
      console.log(err);
    });
}

getCustomerName(id) {
  let result = '';
  this.clienti.forEach((cliente) => {
    if (cliente['SC_ID'] === id) {
      result = cliente['SC_NOME'];
    }
  });
  return result;
}

с использованием async pipe не решает проблему

РЕДАКТИРОВАТЬ: здесь Stackblitz, который показывает проблему: https://stackblitz.com/edit/ng-mat-sort-issue

PS: неопределенная ошибка не регистрируется в моем браузере, только в stackblitz ... кстати сортировка не работает

Спасибо за помощь