Миграция на MDC компоненты в Angular Material 15

[bacr]

Необходимо мигрировать на MDC компоненты после обновления на Angular Material 15.

https://material.angular.io/guide/mdc-migration

[yamaoto]

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

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

так-же стоит учесть

• https://www.reddit.com/r/Angular2/comments/16yp3qg/what_exactly_is_mdc_update_in_material_15/ многие некоторые начали задумываться что бы уйти от материала, в 16 версии еще есть легаси поддержка, в 17 убрана, так что можно как вариант еще переделать импорты на легаси

[bacr]

Ок, думаю надо попробовать смигрировать

[yamaoto]

Current version fixes

• UTF BOM in pacjage.json
• Backend port fix with Properties/launchSettings.json
• SQL Server connection with socket
• authentication.service fixes

  {
      ...user.profile,
      name: user.profile.name ?? "",
      role: user.profile.role ?? ""
    }

[yamaoto]

• blob:

  .ForMember(dest => dest.BlobProp, opt =>
              {
                  opt.Condition(src => src.BlobProp != default);
                  opt.MapFrom((from, _) => ByteString.CopyFrom(from.BlobProp.AsSpan()));
              })
  .ForMember(dest => dest.BlobProp, opt =>
              {
                  opt.Condition(src =>
                      src.BlobPropOneOfCase == UpdateTestEntityRequest.BlobPropOneOfOneofCase.BlobProp);
                  opt.MapFrom((from, _) => from.BlobProp.ToByteArray());
              })

[yamaoto]

изменения для antlr text template шаблонов

• ...Web.Ng\src\app\{name}\{plural-name}.component.html

-<mat-card class="mat-card-list">
+<mat-card appearance="outlined" class="mat-card-list">

• ..Web.Ng\src\app\{name}\{name}-edit.component.ts

-import { MatLegacyDialogRef as MatDialogRef, MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA, MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialogRef, MAT_DIALOG_DATA, MatDialog } from '@angular/material/dialog';

• ..Web.Ng\src\app\{name}\{name}-list.component.ts

-import { LegacyPageEvent as PageEvent } from '@angular/material/legacy-paginator';
-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { PageEvent } from '@angular/material/paginator';
+import { MatDialog } from '@angular/material/dialog';

• ..Web.Ng\src\app\{name}\{name}-view.component.html

-<mat-card class="mat-card-view" *transloco="let t">
+<mat-card appearance="outlined" class="mat-card-view" *transloco="let t">

• ..Web.Ng\src\app\{name}\{name}-view.component.ts

-import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
+import { MatDialog } from '@angular/material/dialog';

• ..Web.Ng\src\app\{name}-core\{name}-select.component.ts

-import { MatLegacyFormFieldControl as MatFormFieldControl } from '@angular/material/legacy-form-field';
+import { MatFormFieldControl } from '@angular/material/form-field';