Как обновить угловой материал MatPaginator до версии 8

Question

Я недавно обновил свой проект, включая угловой материал, до версии 8. Однако есть несколько проблем, которые я не знаю, как исправить.

component.ts

@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;

component.html

   <mat-table #table [dataSource]="dataSource" matSort>

            <!-- Class Column -->
            <ng-container matColumnDef="class">
                <mat-header-cell *matHeaderCellDef mat-sort-header> Class </mat-header-cell>
                <mat-cell *matCellDef="let element"> {{element.class}} </mat-cell>
            </ng-container>

            <!-- Topic Column -->
            <ng-container matColumnDef="topic">
                <mat-header-cell *matHeaderCellDef mat-sort-header> Topic </mat-header-cell>
                <mat-cell *matCellDef="let element"> {{element.topic}} </mat-cell>
            </ng-container>

            <!-- Tme Column -->
            <ng-container matColumnDef="datetime">
                <mat-header-cell *matHeaderCellDef mat-sort-header> Date & Time </mat-header-cell>
                <mat-cell *matCellDef="let element"> {{element.time | date:'medium'}} </mat-cell>
            </ng-container>

            <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
            <mat-row *matRowDef="let row; columns: displayedColumns;" (click)="show(row)"></mat-row>
        </mat-table>


        <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20]" [showFirstLastButtons]="true">
        </mat-paginator>

Вышеупомянутый ViewChild теперь ожидает 2 аргумента.https://angular.io/guide/static-query-migration

Я не уверен, как их обновить, поскольку они были взяты из документации по угловому материалу версии 7.

В документации новой версии нет этих ViewChilds.https://material.angular.io/components/paginator/examples

Я не вижу руководство по миграции углового материала 8.

Answer 1

Во-первых, давайте вспомним, что нам нужно изменить парадигму при обновлении Angular и его библиотек с прямых npm манипуляций для использования схем ng update.

Если обновление не завершилось правильно, и выЕсли у вас нет контроля версий, чтобы отменить изменения и повторить попытку, вы можете выполнить:

ng update @angular/core --migrate-only --from 7 --to 8

, что приведет к повторному выполнению схемы обновления в вашем проекте.Мне пришлось сделать это обновление @angular/materia l, потому что у меня было слишком много файлов, чтобы изменить его, чтобы у сценария не хватило памяти: P

Счастливого ng-кодирования!