Bu şematik, uygulamanızdaki NgStyle direktifi kullanımlarını stil bağlamalarına geçirir. Yalnızca geçirilmesi güvenli kabul edilen kullanımları geçirecektir.
Şematiği aşağıdaki komutu kullanarak çalıştırın:
ng generate @angular/core:ngstyle-to-style
Tek anahtarlı bir nesne, yalnızca o stil özelliğine yapılan bir bağlamaya dönüşür.
Önce
<div [ngStyle]="{'background-color': 'red'}"></div>
Sonra
<div [style.background-color]="'red'"></div>
Birden fazla anahtarı olan bir nesne, tek bir [style] bağlamasına dönüşür.
Önce
<div [ngStyle]="{'color': 'blue', 'font-weight': 'bold'}"></div>
Sonra
<div [style]="{'color': 'blue', 'font-weight': 'bold'}"></div>
Yapılandırma seçenekleri
Geçiş, belirli ihtiyaçlarınıza göre ince ayar yapmak için birkaç seçeneği destekler.
--best-effort-mode
Varsayılan olarak, geçiş NgStyle'ın nesne referansı kullanımlarını geçirmekten kaçınır.
--best-effort-mode bayrağı etkinleştirildiğinde, nesne referanslarına bağlı ngStyle örnekleri de geçirilir.
Bu, geçirilmesi güvenli olmayabilir, örneğin bağlı nesne değiştiriliyorsa.
<div [ngStyle]="styleObject"></div>
şuna dönüşür:
<div [style]="styleObject"></div>