Eş Zamanlı Olmayan İşlemler için rxMethod
Eş zamanlı olmayan akışları rxMethod ile yönetin
Eş Zamanlı Olmayan İşlemler için rxMethod, CoddyKit'te ücretsiz bir Angular Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Angular Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Angular Academy kursu toplamda 4 dersten oluşur.
SignalStore'da Eşzamansız İşlemler
Birçok eylem eşzamansızdır: veri yükleme, gecikmeli arama ve yoklama gibi. SignalStore, bu reaktif ve iptal edilebilir eşzamansız akışları yönetmek için rxMethod sunar.
rxMethod Temelleri
rxMethod, bir RxJS boru hattıyla desteklenen bir yöntem oluşturur. Bu yöntemi bir değerle (veya bir sinyal/Observable ile) çağırdığınızda değer akışa gönderilir.
import { rxMethod } from '@ngrx/signals/rxjs-interop';
import { pipe, switchMap, tap } from 'rxjs';
withMethods((store, api = inject(Api)) => ({
load: rxMethod<string>(pipe(
switchMap(id => api.getById(id)),
tap(item => patchState(store, { current: item }))
))
}))rxMethod Çağırma
Bu yöntemi normal bir yöntem gibi yalın bir değerle çağırın. Değer, tanımladığınız boru hattına girer.
store.load('42');Sinyal Geçirme
Bir sinyali rxMethod'a geçirebilirsiniz. Sinyal her değiştiğinde boru hattını otomatik olarak yeniden çalıştırır; bu, reaktif yüklemeler için idealdir.
selectedId = signal('1');
ngOnInit() {
this.store.load(this.selectedId); // reloads when selectedId changes
}switchMap Eski İşlemleri İptal Eder
switchMap kullanmak, yeni bir değer üretildiğinde devam eden önceki isteğin iptal edilmesi anlamına gelir. Böylece eski ve yavaş bir yanıtın daha yeni bir yanıtın üzerine yazdığı yarış koşulları önlenir.
Yükleme Durumunu İzleme
Başlangıçta bir yükleme bayrağını etkinleştirin ve işlem tamamlandığında temizleyin; böylece kullanıcı arayüzü yükleme göstergeleri görüntüleyebilir.
load: rxMethod<string>(pipe(
tap(() => patchState(store, { loading: true })),
switchMap(id => api.getById(id).pipe(
tap(item => patchState(store, { current: item, loading: false }))
))
))Hata İşleme
Hatalar boru hattının içinde işlenmelidir; aksi hâlde akış tamamlanır ve yöntem çalışmayı durdurur. İç Observable içinde catchError kullanın.
switchMap(id => api.getById(id).pipe(
tap(item => patchState(store, { current: item, error: null })),
catchError(err => {
patchState(store, { error: err.message, loading: false });
return EMPTY;
})
))Gecikmeli Arama
Yazarken arama özelliği için zamana dayalı işleçleri birleştirin. Boru hattı, yalın RxJS'teki gibi gecikme uygular ve geçiş yapar.
search: rxMethod<string>(pipe(
debounceTime(300),
distinctUntilChanged(),
switchMap(q => api.search(q)),
tap(results => patchState(store, { results }))
))Düzleştirme İşlecini Seçme
Eski işlemleri iptal etmek için switchMap, sıraya almak için concatMap, paralel çalıştırmak için mergeMap, meşgulken yeni çağrıları yok saymak için exhaustMap kullanın. Seçiminizi istediğiniz eşzamanlılık davranışına göre yapın.
Otomatik Temizleme
Boru hattının aboneliği mağazanın yaşam döngüsüne bağlıdır. Mağaza yok edildiğinde (bileşen kapsamındaysa) akış sonlandırılır; böylece sızıntı oluşmaz ve elle unsubscribe gerekmez.
Oluşturulurken Başlatma
Mağaza oluşturulduğunda ilk yüklemeyi tetiklemek için rxMethod'u withHooks özelliğiyle birleştirin.
withHooks({
onInit(store) { store.load('initial'); }
})Hızlı Kontrol
rxMethod bilginizi kontrol edin.
Özet
Eşzamansız akışlar için rxMethod kullandınız: değerlerle veya sinyallerle çağırma, bir düzleştirme işleci seçme (eski işlemleri iptal etmek için switchMap), yüklemeyi izleme, hataları catchError ile işleme ve aboneliklerin otomatik olarak temizlenmesine güvenme.
Sıkça Sorulan Sorular
“Eş Zamanlı Olmayan İşlemler için rxMethod” dersi ücretsiz mi?
Evet — “Eş Zamanlı Olmayan İşlemler için rxMethod” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Angular Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Angular Academy kursu toplamda 4 dersten oluşur.
“Eş Zamanlı Olmayan İşlemler için rxMethod” dersinde ne öğreneceğim?
Eş zamanlı olmayan akışları rxMethod ile yönetin Angular Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Angular Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Angular Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.
“Eş Zamanlı Olmayan İşlemler için rxMethod” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Angular Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Angular Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- SignalStore Oluşturma
- Hesaplanan Durum ve Yöntemler
- Eş Zamanlı Olmayan İşlemler için rxMethod
- Varlıklar ve Özel Özellikler