(1) - ilk ()

Ben bir kaç uygulama buldum AuthGuardkullanan s take(1). Projemde kullandım first().

İkisi de aynı şekilde mi çalışıyor?

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/first';
import { Observable } from 'rxjs/Observable';

import { Injectable } from '@angular/core';
import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { AngularFire } from 'angularfire2';

@Injectable()
export class AuthGuard implements CanActivate {

    constructor(private angularFire: AngularFire, private router: Router) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> | boolean {
        return this.angularFire.auth.map(
            (auth) =>  {
                if (auth) {
                    this.router.navigate(['/dashboard']);
                    return false;
                } else {
                    return true;
                }
            }
        ).first(); // Just change this to .take(1)
    }
}

Operatörler first()ve take(1)aynı değil.

first()Operatör, isteğe bağlı alır predicatefonksiyonu ve bir yayan errorkaynak tamamlandığında bir değer eşleşen bildirim.

Örneğin bu bir hata verir:

import { EMPTY, range } from 'rxjs';
import { first, take } from 'rxjs/operators';

EMPTY.pipe(
  first(),
).subscribe(console.log, err => console.log('Error', err));

... bunun kadar iyi:

range(1, 5).pipe(
  first(val => val > 6),
).subscribe(console.log, err => console.log('Error', err));

Bu, yayılan ilk değerle eşleşecek olsa da:

range(1, 5).pipe(
  first(),
).subscribe(console.log, err => console.log('Error', err));

Öte yandan take(1)sadece ilk değeri alır ve tamamlar. Başka bir mantık söz konusu değildir.

range(1, 5).pipe(
  take(1),
).subscribe(console.log, err => console.log('Error', err));

Gözlemlenebilir boş kaynak ile herhangi bir hata yaymaz:

EMPTY.pipe(
  take(1),
).subscribe(console.log, err => console.log('Error', err));

Oca 2019: RxJS 6 için güncellendi

İpucu: Yalnızca şu durumlarda kullanın first():

• Yayılan sıfır öğeyi bir hata koşulu olarak kabul edersiniz (örneğin, yaymadan önce tamamlama) VE % 0'dan daha fazla hata olasılığı varsa, onu nazikçe ele alırsınız
• VEYA Gözlemlenebilir olan kaynağın 1'den fazla öğe yayacağını% 100 biliyorsunuz (bu nedenle asla atamazsınız) .

Sıfır emisyon varsa ve bunu açıkça ele almıyorsanız (ile catchError), o zaman bu hata yayılır, muhtemelen başka bir yerde beklenmedik bir soruna neden olur ve izlenmesi oldukça zor olabilir - özellikle de bir son kullanıcıdan geliyorsa.

Sen daha güvenli kullanarak kapalı take(1)olması koşuluyla çoğunlukla:

• İle Sen TAMAM take(1)kaynak emisyon olmadan tamamlarsa şey yayan değil.
• Satır içi bir yüklem kullanmanıza gerek yoktur (örn. first(x => x > 10))

Not: edebilir bir yüklemi take(1)böyle: .pipe( filter(x => x > 10), take(1) ). Hiçbir şey 10'dan büyük değilse bunda bir hata yoktur.

Ne dersin single()

Daha da katı olmak ve iki emisyona izin vermemek istiyorsanız single(), sıfır veya 2+ emisyon varsa hangi hataları kullanabilirsiniz . Yine bu durumda hataları halletmeniz gerekir.

İpucu: SingleGözlenebilir zincirinizin bir http hizmetini iki kez çağırıp iki gözlemlenebilir şey yaymak gibi fazladan işler yapmamasını sağlamak istiyorsanız, ara sıra yararlı olabilir. singleBorunun sonuna eklemek , böyle bir hata yapıp yapmadığınızı size bildirir. Bunu, yalnızca bir değer yayması gereken gözlemlenebilir bir görevi geçtiğiniz bir 'görev çalıştırıcı'da kullanıyorum, bu yüzden single(), catchError()iyi davranışı garanti etmek için yanıtı iletiyorum.

Neden her zaman first()yerine kullanmıyorsunuz take(1)?

diğer adıyla. Nasıl first potansiyel olarak daha fazla hataya neden olabilir?

Bir servisten bir şey alan ve daha sonra onu first()sizden geçiren bir gözlemlenebiliriniz varsa, çoğu zaman iyi olur. Ancak biri herhangi bir nedenle hizmeti devre dışı bırakmak için gelirse - ve onu yayacak şekilde değiştirirse of(null)veya NEVERdaha sonra herhangi bir alt first()operatör hata vermeye başlar.

Şimdi anlıyorum ki tam olarak istediğiniz şey bu olabilir - bu yüzden bu sadece bir ipucu. Operatör firstbana hitap etti çünkü kulağa biraz daha az 'sakar' geliyordu, take(1)ancak kaynağın yayılmama şansı varsa, hataları ele alma konusunda dikkatli olmalısınız. Tamamen ne yaptığınıza bağlı olacaktır.

Varsayılan bir değeriniz varsa (sabit):

Ayrıca .pipe(defaultIfEmpty(42), first()), hiçbir şey yayınlanmadığında kullanılması gereken varsayılan bir değeriniz olup olmadığını da düşünün . Bu elbette bir hata oluşturmaz çünkü firsther zaman bir değer alır.

Bunun defaultIfEmptyyalnızca akış boş olduğunda tetikleneceğini, yayılan değerin değeri olmadığında tetiklenmeyeceğini unutmayın null.

İşte üç Gözlenebilirler vardır A, Bve Cmermer şemaları ile arasındaki farkı keşfetmek için first, takeve singleoperatörler:

* Açıklamalar :
--o-- değer
----! hatası
----| tamamlama

Https://thinkrx.io/rxjs/first-vs-take-vs-single/ adresinde onunla oynayın .

Zaten tüm cevapları aldım, daha görsel bir açıklama eklemek istedim

Umarım birine yardımcı olur

Hiçbir yerde belirtilmeyen gerçekten önemli bir fark var.

take (1) 1 yayınlar, tamamlar, abonelikten çıkarır

first () 1 yayınlar, tamamlar ancak abonelikten çıkmaz.

Bu, yukarı akış gözlemlenebilirinizin ilk () sonrasında hala sıcak olacağı anlamına gelir ve bu muhtemelen beklenmeyen bir davranıştır.

UPD: Bu, RxJS 5.2.0'a atıfta bulunur. Bu sorun zaten düzeltilmiş olabilir.

Görünüşe göre RxJS 5.2.0'da .first()operatörün bir hatası var ,

Bu hata nedeniyle .take(1)ve .first()aşağıdakilerle kullanıyorsanız oldukça farklı davranabilir switchMap:

İle take(1)davranışını alacak beklendiği gibi:

var x = Rx.Observable.interval(1000)
   .do( x=> console.log("One"))
   .take(1)
   .switchMap(x => Rx.Observable.interval(1000))
   .do( x=> console.log("Two"))
   .subscribe((x) => {})

// In the console you will see:
// One
// Two
// Two
// Two
// Two
// etc...

Ama .first()seninle yanlış davranacaksın:

var x = Rx.Observable.interval(1000)
  .do( x=> console.log("One"))
  .first()
  .switchMap(x => Rx.Observable.interval(1000))
  .do( x=> console.log("Two"))
  .subscribe((x) => {})

// In console you will see:
// One
// One
// Two
// One
// Two
// One
// etc... 

İşte codepen bağlantısı