html - Angular 6'da span için ngModel nasıl ayarlanır?

HTML5

<div class="row rating" style="float:right;">
     <span class="fa fa-star"  name="val1" [(ngModel)]="data.val1"></span>
</div>

TS

data = {
 val1 = ''
}

Not: Ben benzersiz bir isme ihtiyacım var. Yıldız derecelendirme sistemini kullanmak istiyorum. Sadece ismi almak istiyorum.

Cevap #1

Yaklaşımlar

Enterpolasyon

<div class="row rating" style="float:right;">
     <span class="fa fa-star"  name="val1">{{data.val1}}</span>
</div>

Özellik bağlama

<div class="row rating" style="float:right;">
     <span class="fa fa-star"  name="val1" [innerHTML]="data.val1"></span>
</div>

Veri değerlerini string olarak işlerken, bir biçimi diğerine tercih etmek için teknik bir neden yoktur. Daha çok okunabilirliğe yönelirsiniz, bu da genellikle interpolasyonu tercih etmenize neden olur. Kodlama tarzı kuralları belirlemeyi ve hem kurallara uyan hem de mevcut görev için en doğal hissettiren biçimi seçmeyi önerirsiniz.

Not:

Angular NgModel yönergesi, form elemanlarına iki yönlü veri bağlamayı sağlayan bir köprüdür.

Şablon sözdizimi

Cevap #2

ngModel sadece girişler için kullanılabilir (bazı form elemanları olması gerekir). Sanırım aradığınız şey, bileşen modelinden verileri görüntülemenizi sağlayan Angular interpolasyonudur.

<div class="row rating" style="float:right;">
     <span class="fa fa-star"  name="val1">{{data.val1}}</span>
</div>

İlgili makaleler