Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, bir eğitmen ve Bob adlı bir öğrencinin Angular 2 programlama dilinde event binding ve binding kavramlarını anlattığı bir eğitim içeriğidir.
- Videoda Angular 2'de event binding (one way binding ve two way binding), properti kullanımı, ngModel binding, buton click eventleri ve keypress eventleri ile sayısal alan kontrolü gibi konular kod örnekleriyle detaylı şekilde ele alınmaktadır. Eğitmen, kullanıcı bilgileri (ad, soyad) alanını geliştirerek örnekler sunmakta ve click event'lerinde parametre olarak input text'in nasıl gönderilebileceğini göstermektedir.
- Video, Angular 2'de kullanıcı etkileşimleri ve veri alışverişleri yapmak isteyenler için temel bilgileri içermekte olup, bir sonraki videolarda döngüler, servis yapısı ve servislerde injection konularına değinileceği belirtilmiştir.
- 00:01Angular 2'de Eventler ve Binding Kavramları
- Bu videoda Angular 2'de eventler, one way binding, two way binding ve ref kavramları üzerinde örnekler yapılacak.
- Önceki videoda kullanıcı bilgilerinin girildiği ad, soyad gibi alanlar ve buton clicklenme durumları incelenmişti.
- Bu videoda kullanıcı bilgilerini geliştirmek için ad ve soyad alanları eklenecek.
- 01:39Default Değerler ve One Way Binding
- Kullanıcı bilgileri için ad ve soyad değişkenleri oluşturulacak ve default değerler atanacak.
- One way binding için köşeli parantezlerle properti kavramı kullanılır ve textbox'taki değişiklikler değişkenleri etkilemez.
- TextBox'ta yapılan değişiklikler değişkenleri etkilemediği için yukarıdaki bilgiler de değişmez.
- 05:19Two Way Binding
- Two way binding için süslü parantezler içinde "ngModel" kullanılır.
- Two way binding ile textbox'taki değişiklikler değişkenleri etkiler ve değişkenlerdeki değişiklikler textbox'ta görünür.
- Bu sayede kullanıcı bilgileri arasında otomatik bir bağlantı kurulur.
- 07:02Eventler ve Buton Tıklamaları
- Eventler propertilerden farklı olarak normal parantezlerle belirtilir.
- Buton tıklamaları için "onClick" eventi kullanılır ve ilgili metot normal parantez içinde çağrılır.
- Buton tıklandığında textbox'taki değerler konsola log olarak yazdırılabilir.
- 09:55Sayısal Alan Kontrolü
- TextBox'larda sadece sayısal alanların girmesini sağlamak için "onKeyPress" eventi kullanılır.
- "onKeyPress" eventi parametre olarak "keyEvent" alır ve "keyCode" özelliği ile basılacak karakterin ASCII kodu alınabilir.
- Sayısal alan kontrolü için ASCII kodu 49 ile 57 arasında olan karakterler kabul edilir, diğer karakterler reddedilir.
- 14:29Ref Kavramı
- Ref kavramı, bir elementin başka bir elemente bağlanmasını sağlar.
- Ref ile bağımsız bir input alanı eklenebilir.
- Ref ile eklenen element, blok elementlerden bağımsız olarak çalışabilir.
- 15:35Angular'da Referans Değerleri ve Event'ler
- Mail onaylama işlemi çok önemlidir ve daha iyi bir email onay yazısı kullanılmalıdır.
- Referans değeri ile göndermek için, model değerleri yerine nesnelerin kendileri de gönderilebilir.
- Click eventinde parametre olarak txt email'i göndererek, input text'in kendisinin gönderilmesi sağlanabilir.
- 17:01Nesne ve Değer Gönderimi
- "Çekmeyin" adında bir metod oluşturulabilir ve parametre olarak txt email alınabilir.
- Nesnenin kendisi gönderildiğinde, input type text kendisi gelir.
- Nesnenin boylusu (value) göndermek için txt email.value kullanılabilir.
- 18:32Video Özeti ve Gelecek İçerikler
- Bu videoda Angular'da event'ler, propertiler, value propertisi ve referans özelliklerinin değerleri nasıl kullanıldığı gösterildi.
- Önümüzdeki videolarda döngüler, servis yapısı ve servislerde injection konuları ele alınacaktır.
- Bob ile birlikte Angular 2 ile ilgili daha fazla içerik paylaşılacaktır.