我有一个Angular 2服务:
import {Storage} from './storage';
import {Injectable} from 'angular2/core';
import {Subject} from 'rxjs/Subject';
@Injectable()
export class SessionStorage extends Storage {
private _isLoggedInSource = new Subject<boolean>();
isLoggedIn = this._isLoggedInSource.asObservable();
constructor() {
super('session');
}
setIsLoggedIn(value: boolean) {
this.setItem('_isLoggedIn', value, () => {
this._isLoggedInSource.next(value);
});
}
}
一切都很好。但是我有另一个不需要订阅的组件，它只需要在某个时间点获得isLoggedIn的当前值。我该怎么做呢?
可以创建订阅，然后在获取第一个发出的项之后销毁订阅。在下面的例子中，pipe()是一个函数，它使用一个可观察对象作为输入，并返回另一个可观察对象作为输出，同时不修改第一个可观察对象。
用Angular 8.1.0包"rxjs": "6.5.3"， "rxjs-observable": "0.0.7"创建的示例
ngOnInit() {
...
// If loading with previously saved value
if (this.controlValue) {
// Take says once you have 1, then close the subscription
this.selectList.pipe(take(1)).subscribe(x => {
let opt = x.find(y => y.value === this.controlValue);
this.updateValue(opt);
});
}
}
可以创建订阅，然后在获取第一个发出的项之后销毁订阅。在下面的例子中，pipe()是一个函数，它使用一个可观察对象作为输入，并返回另一个可观察对象作为输出，同时不修改第一个可观察对象。
用Angular 8.1.0包"rxjs": "6.5.3"， "rxjs-observable": "0.0.7"创建的示例
ngOnInit() {
...
// If loading with previously saved value
if (this.controlValue) {
// Take says once you have 1, then close the subscription
this.selectList.pipe(take(1)).subscribe(x => {
let opt = x.find(y => y.value === this.controlValue);
this.updateValue(opt);
});
}
}
一个类似的答案被否决了。但我认为我可以证明我在这里提出的建议适用于有限的情况。
虽然一个可观察对象确实没有当前值，但通常它会有一个立即可用的值。例如，对于redux / flux / akita存储，您可以根据一些可观察的数据从中央存储请求数据，这些值通常会立即可用。
如果是这种情况，那么当您订阅时，该值将立即返回。
假设你有一个对服务的调用，在完成时你想从你的商店中获得一些东西的最新值，这可能不会发出:
你可以尝试这样做(你应该尽可能地把事情“放在管道里”):
serviceCallResponse$.pipe(withLatestFrom(store$.select(x => x.customer)))
.subscribe(([ serviceCallResponse, customer] => {
// we have serviceCallResponse and customer
});
这样做的问题是它会阻塞，直到第二个可观察对象发出一个值，而这可能永远不会发生。
我发现自己最近只需要在一个值立即可用的情况下评估一个可观察到的值，更重要的是，我需要能够检测到它是否可用。我最后是这样做的:
serviceCallResponse$.pipe()
.subscribe(serviceCallResponse => {
// immediately try to subscribe to get the 'available' value
// note: immediately unsubscribe afterward to 'cancel' if needed
let customer = undefined;
// whatever the secondary observable is
const secondary$ = store$.select(x => x.customer);
// subscribe to it, and assign to closure scope
sub = secondary$.pipe(take(1)).subscribe(_customer => customer = _customer);
sub.unsubscribe();
// if there's a delay or customer isn't available the value won't have been set before we get here
if (customer === undefined)
{
// handle, or ignore as needed
return throwError('Customer was not immediately available');
}
});
请注意，对于以上所有内容，我都使用subscribe来获取值(正如@Ben讨论的那样)。没有使用.value属性，即使我有一个行为主体。
虽然这听起来有点夸张，但这只是另一个“可能”的解决方案，可以保持Observable类型并减少样板文件……
你总是可以创建一个扩展getter来获取Observable的当前值。
要做到这一点，你需要在global.d.t types声明文件中扩展Observable<T>接口。然后在observable.extension.ts文件中实现扩展getter，最后将类型和扩展文件都包含到应用程序中。
你可以参考这个StackOverflow的答案来了解如何将这些扩展包含到你的Angular应用中。
// global.d.ts
declare module 'rxjs' {
interface Observable<T> {
/**
* _Extension Method_ - Returns current value of an Observable.
* Value is retrieved using _first()_ operator to avoid the need to unsubscribe.
*/
value: Observable<T>;
}
}
// observable.extension.ts
Object.defineProperty(Observable.prototype, 'value', {
get <T>(this: Observable<T>): Observable<T> {
return this.pipe(
filter(value => value !== null && value !== undefined),
first());
},
});
// using the extension getter example
this.myObservable$.value
.subscribe(value => {
// whatever code you need...
});
