如何在 Angular 中使用 getter 和 setter 实现 BehaviorSubject 2
How to implement BehaviorSubject with getter and setter in Angular 2
我正在尝试在我的 LoginService 中实现 BehaviorSubject
类型的 isLoggedIn
布尔值以及 getter 和 setter 函数以获取作为 Observable 的值/ 通过其 BehaviorSubject 正确设置变量。这是可行的,但是它会在 TSLint 中抛出两个关于 "Type not assignable" 和 "Dublicate identifier" 的错误。在没有 TSLint 抱怨的情况下定义它的正确方法是什么。
这是上述代码的精简版:
@Injectable()
export class LoginService {
public isLoggedInSource = new BehaviorSubject<boolean>(false);
public isLoggedIn: Observable<boolean> = this.isLoggedInSource.asObservable(); // Duplicate identifier 'isLoggedIn'.
constructor(private http: Http) {}
set isLoggedIn(logged): void { // Duplicate identifier 'isLoggedIn'.
this.isLoggedInSource.next(logged);
}
get isLoggedIn(): Observable<boolean> { // Duplicate identifier 'isLoggedIn'.
return this.isLoggedInSource.asObservable();
}
logout() {
this.isLoggedIn = false; // Type 'boolean' is not assignable to type 'Observable<boolean>'.
}
login(body) {
return this.http.post('/login', body)
.map(res => {
if (res.token) {
this.isLoggedIn = true; // Type 'boolean' is not assignable to type 'Observable<boolean>'.
}
return res;
})
.catch(err => Observable.throw(err););
}
}
当您使用 TypeScript getter/setter
时,您必须重命名您的 属性,因此 属性 名称应不同于 getters/setters
名称。
此外,您可以通过将 behaviorSubject
设置为服务的私有成员来修改您的代码,并且只公开您的 Observable
.
@Injectable()
export class LoginService {
private isLoggedInSource = new BehaviorSubject<boolean>(false);
public _isLoggedIn: Observable<boolean> = this.isLoggedInSource.asObservable();
constructor() {}
set isLoggedIn(logged: boolean) {
this.isLoggedInSource.next(logged);
}
get isLoggedIn() {
return this._isLoggedIn;
}
logout() {
this.isLoggedIn = false;
}
login() {
this.isLoggedIn = true;
}
}
并且您将能够监听组件中的更改:
export class App {
constructor(private loginService: LoginService) {
loginService.isLoggedIn.subscribe(bool => console.log(bool));
//Wait and simulate a login
setTimeout(() => {
loginService.login();
}, 1200);
}
}
我正在尝试在我的 LoginService 中实现 BehaviorSubject
类型的 isLoggedIn
布尔值以及 getter 和 setter 函数以获取作为 Observable 的值/ 通过其 BehaviorSubject 正确设置变量。这是可行的,但是它会在 TSLint 中抛出两个关于 "Type not assignable" 和 "Dublicate identifier" 的错误。在没有 TSLint 抱怨的情况下定义它的正确方法是什么。
这是上述代码的精简版:
@Injectable()
export class LoginService {
public isLoggedInSource = new BehaviorSubject<boolean>(false);
public isLoggedIn: Observable<boolean> = this.isLoggedInSource.asObservable(); // Duplicate identifier 'isLoggedIn'.
constructor(private http: Http) {}
set isLoggedIn(logged): void { // Duplicate identifier 'isLoggedIn'.
this.isLoggedInSource.next(logged);
}
get isLoggedIn(): Observable<boolean> { // Duplicate identifier 'isLoggedIn'.
return this.isLoggedInSource.asObservable();
}
logout() {
this.isLoggedIn = false; // Type 'boolean' is not assignable to type 'Observable<boolean>'.
}
login(body) {
return this.http.post('/login', body)
.map(res => {
if (res.token) {
this.isLoggedIn = true; // Type 'boolean' is not assignable to type 'Observable<boolean>'.
}
return res;
})
.catch(err => Observable.throw(err););
}
}
当您使用 TypeScript getter/setter
时,您必须重命名您的 属性,因此 属性 名称应不同于 getters/setters
名称。
此外,您可以通过将 behaviorSubject
设置为服务的私有成员来修改您的代码,并且只公开您的 Observable
.
@Injectable()
export class LoginService {
private isLoggedInSource = new BehaviorSubject<boolean>(false);
public _isLoggedIn: Observable<boolean> = this.isLoggedInSource.asObservable();
constructor() {}
set isLoggedIn(logged: boolean) {
this.isLoggedInSource.next(logged);
}
get isLoggedIn() {
return this._isLoggedIn;
}
logout() {
this.isLoggedIn = false;
}
login() {
this.isLoggedIn = true;
}
}
并且您将能够监听组件中的更改:
export class App {
constructor(private loginService: LoginService) {
loginService.isLoggedIn.subscribe(bool => console.log(bool));
//Wait and simulate a login
setTimeout(() => {
loginService.login();
}, 1200);
}
}