我想创建一个可以在 Angular 6 中传递一些参数的观察。
下面是在 Angular 站点中创建 observable 的示例代码 https://angular.io/guide/observables ,但它没有解释如何传递任何参数。
// Create an Observable that will start listening to geolocation updates
// when a consumer subscribes.
const locations = new Observable((observer) => {
// Get the next and error callbacks. These will be passed in when
// the consumer subscribes.
const {next, error} = observer;
let watchId;
// Simple geolocation API check provides values to publish
if ('geolocation' in navigator) {
watchId = navigator.geolocation.watchPosition(next, error);
} else {
error('Geolocation not available');
}
// When the consumer unsubscribes, clean up data ready for next subscription.
return {unsubscribe() { navigator.geolocation.clearWatch(watchId); }};
});
// Call subscribe() to start listening for updates.
const locationsSubscription = locations.subscribe({
next(position) { console.log('Current Position: ', position); },
error(msg) { console.log('Error Getting Location: ', msg); }
});
// Stop listening for location after 10 seconds
setTimeout(() => { locationsSubscription.unsubscribe(); }, 10000);
我想要的是在订阅时将一些参数传递给 observable,我猜 observable 的定义可能如下所示:
const myobservable(a, b) = new Observable((observer) => {
...
})
你能告诉我怎么做吗?
最佳答案
您不能将参数传递给 subscribe , subscribe 是一个回调函数,它将在发出可观察序列中的每个值时执行。
当您订阅时,您可以将值作为参数传递给函数 not subscribe 并使用该参数执行某些操作
SomeObservableFunction(10).subscribe(function(x){
});
为了了解 observable 的工作原理,请查看以下示例代码片段
var observable = Observable.create(function(observer) {
var sum = 0;
for (var i = 1; i <= 4; i++) {
if (i <= 3) {
sum = sum + i;
observer.next(i); //You can emit each item from the observable also
}
if (i === 4) {
setTimeout(
i => {
observer.next(sum);
observer.complete();
},
5000,
i
);
}
}
});
在这个示例代码中,我正在运行一个 for 循环并使用 Observer.next(value) 发出每个值,当 i 的值变为 4 时,您可以看到发出 3 个数字的总和并通过简单调用 observable 退出所有可观察序列。完全的();
Observables are lazy which means , the above code never executes unless you are subcribing it.
让我们订阅以获取每个值。我正在删除 lamda 表达式以更清楚地理解
observable.subscribe({
next: function(x) {
console.log("got value " + x);
},
error: err => console.error("something wrong occurred: " + err),
complete: function() {
//when I become 4 it will complete
console.log("completed");
}
});
在 next 的回调函数中,您将获得我们从 observable 发出的所有值,包括 sum 作为最终值,然后它将执行完整的回调函数。
您也可以像下面的语法一样简单地接收每个值,这类似于下一个回调
observable.subscribe(function(x) {
//here you will get all the value including sum
console.log(x);
});
让我通过简单地注释一行代码来告诉您使用相同示例的另一种场景。我没有发出每个值,而是只想从可观察的和完整的中发出总和。
var observable = Observable.create(function(observer) {
var sum = 0;
for (var i = 1; i <= 4; i++) {
if (i <= 3) {
sum = sum + i;
//commented the code
}
if (i === 4) {
setTimeout(
i => {
observer.next(sum);
observer.complete();
},
5000,
i
);
}
}
});
现在,当您订阅时,您将只有一个值,即 sum
observable.subscribe(function(x) {
//here you will get the sum
console.log(x);
});
现在回到您的问题,要传递参数,您可以将整个 observable 包装到一个返回 observable 的函数中。例如
SomeObservableFunction(someparam){
var observable = Observable.create(function(observer) {
//I am not writing the same code block here
});
return observable;
}
关于angular - 如何在 Angular 6 中使用参数创建 observable?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52416621/