Açısal Şablonlar

Angular'da bir şablon, bir kullanıcı arayüzünün (UI) bir parçası için bir plandır. Şablonlar HTML'de yazılır ve Angular'ın birçok özelliği üzerine inşa etmek için bir şablon içinde özel sözdizimi kullanılabilir.

Angular, şablonlarınızdaki HTML sözdizimini ek işlevlerle genişletir.
Örneğin, Angular'ın veri bağlama sözdizimi, Belge Nesne Modeli (DOM) özelliklerinin dinamik olarak ayarlanmasına yardımcı olur.

Hemen hemen tüm HTML sözdizimi geçerli şablon sözdizimidir. Ancak Angular şablonu kullanıcı arayüzünün yalnızca bir parçası olduğundan <html>, <body> veya <base> gibi öğeleri içermez.

Not:- Komut dosyası enjeksiyon saldırıları riskini ortadan kaldırmak için Angular, şablonlarda <script> öğesini desteklemez. Angular, <script> etiketini yok sayar ve tarayıcı konsoluna bir uyarı verir. Daha fazla bilgi için Güvenlik sayfasına bakın.

Enterpolasyonlu değeri görüntüleme

Enterpolasyon, ifadelerin işaretlenmiş metne gömülmesi anlamına gelir. Varsayılan olarak enterpolasyon, sınırlayıcı olarak {{ ve }} çift kaşlı ayraçları kullanır.

Misal:

uygulama.bileşen.ts

message = "Here is the initialize message";

<p> {{message}} </p>

Misal:-

<p>{{title}}</p>
<div><img alt="item" src="{{itemImageUrl}}"></div>

uygulama.bileşen.ts

message = "Here is the initialize message";
getMessage():string{
  return this.message;
}

<p>{{getMessage()}}</p>

Şablon ifadeleri, kullanıcı olaylarına yanıt vermek için HTML'nizde kullanabileceğiniz yöntemler veya özelliklerdir. Şablon ifadeleriyle uygulamanız, dinamik içerik görüntüleme veya form gönderme gibi eylemler yoluyla kullanıcıların ilgisini çekebilir.

Misal:-

(click) = "updateMessage()"
<button (click) = "updateMessage()">Update Message</button>

Şablon ifadeleri gibi, şablon ifadeleri de JavaScript'e benzeyen bir dil kullanır. Ancak, şablon ifadeleri için ayrıştırıcı, şablon ifadeleri için ayrıştırıcıdan farklıdır. Ek olarak, şablon deyimleri ayrıştırıcısı özellikle hem temel atamaları (=) hem de noktalı virgüllerle (;) zincirleme ifadeleri destekler.

Aşağıdaki JavaScript ve şablon ifadesi sözdizimine izin verilmez:

1. yeni
2. Arttırma ve azaltma operatörleri, ++ ve —
3. += ve -= gibi operatör atamaları
4. | gibi bitsel işleçler ve &
5. boru operatörü