이 스키매틱은 애플리케이션의 NgStyle 디렉티브 사용을 스타일 바인딩으로 마이그레이션합니다. 안전하게 마이그레이션할 수 있다고 판단되는 경우만 변환합니다.
다음 명령어로 스키매틱을 실행하세요.
ng generate @angular/core:ngstyle-to-style키가 하나인 객체는 해당 스타일 프로퍼티에 대한 바인딩으로 변환됩니다.
이전
<div [ngStyle]="{'background-color': 'red'}"></div>이후
<div [style.background-color]="'red'"></div>키가 여러 개인 객체는 하나의 [style] 바인딩으로 변환됩니다.
이전
<div [ngStyle]="{'color': 'blue', 'font-weight': 'bold'}"></div>이후
<div [style]="{'color': 'blue', 'font-weight': 'bold'}"></div>설정 옵션
이 마이그레이션은 요구 사항에 맞게 동작을 조정할 수 있는 몇 가지 옵션을 지원합니다.
--best-effort-mode 옵션
기본적으로 마이그레이션은 객체 참조를 사용하는 NgStyle을 변환하지 않습니다.
--best-effort-mode 플래그를 활성화하면 객체 참조에 바인딩된 ngStyle도 마이그레이션합니다.
하지만 바인딩된 객체를 직접 변경하는 경우처럼 안전하지 않은 변환이 될 수도 있습니다.
<div [ngStyle]="styleObject"></div>다음과 같이 변환됩니다.
<div [style]="styleObject"></div>