Geliştir.Net

C# .Net, Angular ve daha fazlası

Angular Service içine başka bir Service Inject etmek
Angular Service içine başka bir Service Inject etmek

Angular’ da bir service oluştururken, başka bir service’ i de onun içinde kullanmak isteyebilirsiniz. Bunu gerçekleştirebilmek için, kavraması çok BASİT olan Angular Service Hiyerarşisi‘ ni bilmeniz gerekiyor. bknz : https://gelistir.net/461/angular-dependency-injection-hiyerarsi-si/ Bir Service’ i kullanabilmeniz için, service’ in çalıştığınız bileşende yada bir üst bileşende tanımlı olması gerekiyor. Service’ lerin kendisi component ler gibi, direk olarak bir... » read more

Angular Dependency Injection Hiyerarşi’ si
Angular Dependency Injection Hiyerarşi’ si

Pek çok farklı framework’ ün de sunduğu dependency injection özelliğine, Angular için https://gelistir.net/374/angular-service-ve-dependency-injection/ adresinde değinmiştik. Bu başlıkta ise Hiyerarşi‘ sine değineceğiz. Angular’ da dependency injection tepeden aşağı ilerleyen bir yapıdadır. Bir service’ i nerede inject ettiyseniz, o bileşenin altındaki tüm bileşenlerde, AYNI state‘ e sahip olarak yaşamını sürdürebilir. Lakin bu durum overwrite edilebilir. Bu seçenek... » read more

Angular Service oluşturmak [Basics]
Angular Service oluşturmak [Basics]

Bu başlıkta ilk Angular Service’ imizi oluşturacağız. İlk olduğu için basit bir iş yapacak. Lakin yaptığı işten ziyade, nasıl yaptığı ve diğer bileşenler ile olan ilişkisini net bir şekilde göreceğiz. Service Oluşturmak CLI vasıtası ile logging isminde ve services klasöründe yer alan bir service oluşturuyoruz; ng generate service services/logging Oluşan service’ i inceleyelim; import {... » read more

Angular Service Nedir ?
Angular Service Nedir ?

Angular ile uygulama geliştirmeye yeni başlayanlar "angular service nedir ?" şeklinde arıyorsanız, maalesef yanlış bir arama yapıyorsunuz… Çünkü service bir design pattern’ dir. Framework, dil vb. farketmez. Service yapısının kendisi dilden, framework’ ten bağımsızdır. Service yapısı, component, directive, decorator gibi Angular’ a ait yapılardan biri değildir. Service Nedir ? Servis yönelimli dizayn paradigmasını uygulayan bir... » read more

Angular ngSwitch [Performans]
Angular ngSwitch [Performans]

Angular’ da karar verme yapılarını daha önce incelemiştik. bknz : https://gelistir.net/238/angular-ngif-ve-else/ ngIf ve else directive’ leri mümkün kıldığı kullanım imkanları ile ngSwitch’ e ihtiyaç duydurtmuyor. LAKİN, söz konusu performans olduğunda, ngSwitch’ e ihtiyaç duyabiliyoruz. Neden Switch ? https://gelistir.net/78/switch-ve-if-else-if-kiyaslamasi/ adresinde, NEDEN Switch yapısına ihtiyaç duyarız sorusuna cevap vermiştim. Switch yapısını Angular uygulamalarımızda mutlaka kullanacağımız noktalar olacaktır.... » read more

Angular Directive’ lere parametre eklemek
Angular Directive’ lere parametre eklemek

Angular directive özelliğinin en etkili kullanım şekli parametre verebilmektir. Element’ e eklenen directive, hardcoded şekilde DOM manipülasyonları yapmamalıdır. Daha önce https://gelistir.net/430/angular-hostlistener-ile-dom-event-leri-dinlemek/ adresinde, elementlerin mouse ile etkileşimleri sonucu oluşan event’ lerde, element’ in arkaplan rengini sarı renkte yaparak bir DOM manipülasyon gerçekleştirmiştik. Lakin bu manipülasyon tamamen hardcoded şekilde oldu. En basitinden, bu tarz bir directive’ de... » read more

Angular HostListener ile DOM Event’ leri dinlemek
Angular HostListener ile DOM Event’ leri dinlemek

Angular Directive özelliğini https://gelistir.net/415/angular-directive-olusturmak/ adresindeki başlıkta incelemiştik. Bu başlıkta ise HostListener ile html elementlerine dair DOM event’ lerini dinleyeceğiz ve aksiyon alacağız. HostListener nedir ? Angular Directive de kullanılan bir decorator’ dür. Directive’ in eklendiği element’ in javascript dom event’ lerini dinler. DOM eventler bknz : https://www.w3schools.com/js/js_htmldom_events.asp Decorator’ de belirttiğiniz event, element için tetiklendiğinde, içerisine... » read more

Angular Directive Oluşturmak
Angular Directive Oluşturmak

Directive Nedir ? Angular’ da DOM manipülasyonları yaparken en çok kullandığımız özelliklerden biri de directive’ lerdir. HTML elementlerine eklenirler ve eklendikleri element’ in DOM manipülasyonlarını gerçekleştirirler. Angular pek çok dahili directive’ i barındırmaktadır. Örneğin; ngFor, ngIf, ngClass, ngStyle ilk akla gelenlerdir. Bu başlıkta, kendi directive’ imizi de yazmayı inceleyeceğiz. Directive Oluşturmak Örnek olarak oluşturacağımız directive... » read more

Angular Notlar
Angular Notlar

Bu başlıkta, Angular framework’ ü öğrenirken tekrar etmemiz gerekebilecek konuları kısa notlar halinde ekliycem. Component Her Component bir directive‘ dir. Ama her directive bir component değildir ! Component, Directive’ in EXTEND edilmiş halidir. İç içe component ler hakkında konuşurken, üstteki yani kapsayan component’ e Parent Component, kapsanan component’ e Child Component denir. Child component’ ten... » read more

Angular Lifecycle Hooks Örnekleri
Angular Lifecycle Hooks Örnekleri

Angular’ da component’ lerin yaşam döngüsünde "belirli anlar" vardır. Bu anlar, angular tarafından takip edilerek, component’ in içerisinde, ilgili metodlar vasıtası ile ele alınır. Daha önce https://gelistir.net/381/angular-component-yasam-dongusu-lifecycle/ adresinde bu konuya değinmiştim. Bu başlıkta ise, canlı örneklemelerini göstereceğim. Yaşam döngüsü içerisinde yakaladığımız tüm eventlere hook adını veriyoruz. AppComponent ve AltComponent ile çalışacağız. Event’ ler altcomponent’ te... » read more