Ce schematic migre les utilisations de la directive NgStyle vers des style bindings dans votre application. Il ne migre que les utilisations considérées comme sûres à migrer.
Lancez le schematic avec la commande suivante :
ng generate @angular/core:ngstyle-to-style
Un objet avec une seule clé devient un binding vers cette unique propriété de style.
Avant
<div [ngStyle]="{'background-color': 'red'}"></div>
Après
<div [style.background-color]="'red'"></div>
Un objet avec plusieurs clés devient un unique binding [style].
Avant
<div [ngStyle]="{'color': 'blue', 'font-weight': 'bold'}"></div>
Après
<div [style]="{'color': 'blue', 'font-weight': 'bold'}"></div>
Options de configuration
La migration propose quelques options pour l'ajuster finement à vos besoins.
--best-effort-mode
Par défaut, la migration évite de migrer les utilisations de NgStyle liées à des références d'objets.
Quand l'option --best-effort-mode est activée, les instances de ngStyle liées à des références d'objets sont aussi migrées.
Cette migration peut ne pas être sûre, par exemple si l'objet lié est muté.
<div [ngStyle]="styleObject"></div>
devient
<div [style]="styleObject"></div>