typescript - Angular 2 Observables kan ikke tilordnes til boolean
Jeg prøver å bruke Observables i Angular 2 for å overvåke en enkel endring i en boolean kalt loggedIn som kan være sann eller usann. Jeg får denne feilen i TS.
Type 'boolean' kan ikke tildeles typen 'Subject'. Type 'boolean' kan ikke tildeles typen 'Observable'.
Kan noen foreslå et alternativ eller fortelle meg hva jeg gjør galt?
import { Injectable } from '@angular/core';
import { Http, Headers } from '@angular/http';
import {Subject} from "../../node_modules/rxjs/src/Subject";
import {Observable} from "../../node_modules/rxjs/src/Observable";
@Injectable()
export class UserService {
user: Subject<any>;
user$: Observable<any>;
//loggedIn: Subject<any>;
//loggedIn$: Observable<any>;
loggedIn: boolean;
constructor(private http: Http) {
this.user = new Subject();
this.user$ = this.user.asObservable();
this.loggedIn = false;
//this.loggedIn = new Subject();
//this.loggedIn$ = this.user.asObservable();
}
createAccount(user) {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
return this.http
.post(
'/api/accounts',
JSON.stringify(user),
{ headers }
)
.map(res => res.json())
.map((res) => {
if (res['success']) {
localStorage.setItem('auth_token', res['auth_token']);
//this.loggedIn$ = true;
//this.loggedIn.next(true);
}
return res['success'];
});
}
login(user) {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
return this.http
.post(
'/api/authenticate',
JSON.stringify(user),
{ headers }
)
.map(res => res.json())
.map((res) => {
console.log('Login Result:', res.user);
if (res["success"]) {
localStorage.setItem('jwt', res.token);
//set user service info...
//this.user.next(res.user[0]);
//this.loggedIn.next(true);
}
return res;
});
}
updateAccount(user) {
let headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('x-access-token', localStorage.getItem('jwt'));
console.log('PAYLOAD FOR UPDATE USER: ' , user);
return this.http
.put(
'/api/accounts/' + user._id,
JSON.stringify(user),
{ headers }
)
.map(res => res.json())
.map((res) => {
if (res['success']) {
localStorage.setItem('auth_token', res['auth_token']);
//this.loggedIn$ = true;
//this.loggedIn.next(true);
}
return res['success'];
});
}
logout() {
localStorage.removeItem('auth_token');
//this.loggedIn$ = false;
//this.loggedIn.next(false);
}
}
Vennligst se linjene som er kommentert ut. Jeg trenger å abonnere på Observable som vil returnere sann eller usann når som helst.
Svar #1
Bruk et subject for å sende ut verdier. Bruk private loggedIn: ReplaySubject<boolean>=new ReplaySubject(1); hvis du vil sende ut tilstanden ved abonnement, men ikke ønsker en initial tilstand. Hvis du ønsker en initial tilstand, bruk private loggedIn: BehaviorSubject<boolean>=new BehaviorSubject(false);.
Ikke presenter emner som offentlige egenskaper - eksponer kun observables, for eksempel loggedIn$: Observable<boolean>=this.loggedIn.asObservable();. Forbrukere av tjenesten bør bare kunne endre tilstanden gjennom offentlige metoder på en kontrollert måte.
Dette er noen av delene av tjenesten din som har med den innloggede tilstanden å gjøre.
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable, ReplaySubject } from 'rxjs';
@Injectable({
providedIn: 'root',
})
export class UserService {
private readonly loggedIn: ReplaySubject<boolean> = new ReplaySubject(1);
readonly loggedIn$: Observable<boolean> = this.loggedIn.asObservable();
constructor(private readonly http: HttpClient) {}
login(user): Promise<any> {
return this.http
.post(/* (...) */)
.map((res) => {
if (res["success"]) {
this.loggedIn.next(true);
}
});
}
logout(): void {
this.loggedIn.next(false);
}
}
Så vi eksponerer tilstanden som en Observable<boolean> i den offentlige loggedIn$ egenskapen, som kun er Observable-grensesnittet til den private loggedIn-subjektegenskapen. Tilstanden endres ved å sende ut en verdi til loggedIn som observeres av abonnenter av loggedIn$.
