typescript - Angular2 - Servis değişkeni değişikliklerine abone olma

Authenticated değişkenini doğru veya yanlış yapan bir kimlik doğrulama servisime sahibim.

checkAuthentication(){
  this._authService.getAuthentication()
    .subscribe(value => this.authenticated = value);
}

this.authenticated değeri değiştiğinde bir fonksiyonu nasıl çalıştırabilirim? ngOnChanges değişikliği algılamıyor.

Cevap #1

Serviste authenticated değerini tutmak ve bileşenler arasında paylaşmak için BehaviorSubject kullanabilirsiniz, farklı yerlerde doğrulamayı kontrol etmek için value'sini ve değişime tepki vermek için subscribe() yöntemini kullanabilirsiniz...

class AuthService {
  public authenticated = new BehaviorSubject(null);
  getAuthentication() {
    this._http.get('/authenticate')
      .map(response => response.json())
      .map(json => Boolean(json)) // or whatever check you need...
      .subscribe((value: boolean) => this.authenticated.next(value))
  }
}

class Component {
  constuctor(private _authService: AuthService) {
    // Only check once even if component is 
    // destroyed and constructed again
    if (this._authService.authenticated.value === null)
      this._authService.getAuthentication();
  }

  onSubmit(){
    if (!this._authService.authenticated.value)
      throw new Error("You are authenticated!")
  }
}

this.authenticated değeri değiştiğinde bir fonksiyonu nasıl çalıştırırım?

  this._authService.authenticated
   .subscribe((value: boolean) => console.log(value))

Cevap #2

Bence servisinize ait authenticated özelliği güncellendiğinde bunu tespit etmek için TypeScript’in get/set sözdizimini kullanabilirsiniz:

  private _authenticated:Boolean = false;
  get authenticated():Boolean {
        return this._authenticated ;
  }
  set authenticated ( authenticated Boolean) {
    // Plugin some processing here
      this._ authenticated = authenticated;
  }

Bir değer atandığında, "kimlik doğrulandı olarak ayarla" bloğu çağrılır. Örneğin, şu kod ile:

this.authenticated = true;

Daha fazla ayrıntı için bu soruya bakın:

  • TypeScript'te alma ve ayarlama

Bununla birlikte, serviste bir EventEmitter özelliğinden de yararlanabilirsiniz. Authenticated özelliği güncellendiğinde, ilgili olay tetiklenebilir.

export class AuthService {
  authenticatedChange: Subject<boolean> = new Subject();

  constructor() {}

  emit(authenticated) {
    this.authenticatedChange.next(authenticated);
  }

  subscribe(component, callback) {
    // set 'this' to component when callback is called
    return this.authenticatedChange.subscribe(data => {
      callback(component, data);
    });
  }
}

Daha fazla detay için bu linke bakın:

  • Delegasyon: Angular2'de EventEmitter veya Observable

İlgili makaleler