Angular таблица матов не обновляется при использовании наблюдаемого - PullRequest
Новая
       52

Angular таблица матов не обновляется при использовании наблюдаемого

0 голосов
/ 08 мая 2020

У меня проблемы с мат-таблицей, которая не загружает новые данные после того, как она была изначально создана. Я перешел с обычной таблицы html с помощью ngFor для генерации строк, которые отлично работали с тем же источником данных. Это таблица матов html, которую я использую: 

<table mat-table [dataSource]="stocks" multiTemplateDataRows class="mat-elevation-z8">

    <ng-container matColumnDef="symbol">
      <th mat-header-cell *matHeaderCellDef> Symbol </th>
      <td mat-cell *matCellDef="let stock"> {{stock.symbol}} </td>
    </ng-container>

    <ng-container matColumnDef="price">
      <th mat-header-cell *matHeaderCellDef> Price </th>
      <td mat-cell *matCellDef="let stock"> {{stock.price}} </td>
    </ng-container>

    <ng-container matColumnDef="change">
      <th mat-header-cell *matHeaderCellDef> Change </th>
      <td mat-cell *matCellDef="let stock"> {{stock.change}} </td>
    </ng-container>

    <ng-container matColumnDef="changePercent">
      <th mat-header-cell *matHeaderCellDef> % Change </th>
      <td mat-cell *matCellDef="let stock"> {{stock.changePercent}} </td>
    </ng-container>

    <tr mat-header-row *matHeaderRowDef="columns"></tr>
    <tr mat-row *matRowDef="let row; columns:columns;" class="example-detail-row"></tr>
  </table>

Это обычная таблица HTML, которая работала: 

<table>
        <tr>
          <th>Symbol</th>
          <th>Price</th>
          <th>Change</th>
          <th>% Change</th>
        </tr>
        <tr *ngFor="let stock of stocks | async" class="stock">
          <td>{{ stock.symbol }}</td>
          <td>{{ stock.price }} {{ stock.currency }}</td>
          <td>{{ stock.change }}</td>
          <td>{{ stock.changePercent }}</td>
        </tr>
    </table>

Переменные акции имеют тип Observable. Любые предложения относительно того, почему таблица больше не обновляется при изменении значения «stock»?

Edit: Stocks устанавливается с использованием этого: 

constructor(private storageService: StorageService){
 this.stocks = this.storageService.getAllStocks(); 
}

Функция getAllStocks () делает несколько запросов в API, а затем возвращает их как Observable

Edit2: 

getAllStocks(): Observable<any[]> {
return of(this.allStocks);

}

, где allStocks - это список акций внутри службы

...