Eğitm Sayısı :532
AnasayfaAngular 2 DersleriAngular 2 Dersleri | 6 List Todo Uygulaması ngFor

Angular 2 Dersleri | 6 List Todo Uygulaması ngFor

angular2-ngfor

Angular2 ile bu dersimizde küçük bir todo uygulaması yaparak bir diziden verileri alıp bunları listeleyerek angular 2 yeni gelen yapısal directive’lere değinerek bunların kullanımından bahsedeceğiz.

Bu yapısa directiveler hangisi derseniz, *ngFor, *ngIf ve class yapısından bahsedeceğiz, ayrıca const ve let özelliğinede değeneceğiz typrscriptte kullanacağımız yazım dilinde let ve constta kısaca değinerek ilerleyen derslerimizde de bunlara ayrıca değineceğiz,

ilk olarak bir dizi oluşturarak bu dizimizi class’ımızın içinde kullanacağımız yere aktarım yapıyoruz bu dizimiz bir servistende de gelebilir tabi şu an manuel olarak oluşturuyoruz.
Daha sonra template kısmında belirttiğimiz üzere li etiketileri içirisinde verilerimizin içinde dönerek ekrana yazdırma işlemi yapıyoruz. Anglardan aşina olduğunuz ng-repeat burada ngFor olarak yerini alıyor.

Angular 2 de ngIf ile yine istediğimiz değer sağlanıyorsa textbox’u gösterme işlemi yapıyoruz ve bunu li içinde bir click fonksyionu tanımlayarak ve bu tanımladığımız fonksiyona o gelen li içindeki bilgiyi gönderiyoruz daha sonra tıklama işlemi gerçekleştiğinde class’ içerisinde verimizi aktarıyoruz bir değişkene ve o değişkenden tekrar alarak inputun ngModel’ina twoway-bind olarak işleme sokuyoruz.

Eğitimde Web 2.0 Uy
Angular 2 Dersleri |

ademyalcin27@gmail.com

Oy
Henüz yorum yapılmadı . İlk sen neden yorum yapmayasın ?

Yorum yap

CAPTCHA (Şahıs Denetim Kodu) Resmi

*