我开始更详细地学习 Rxjs。我正在尝试不同的代码然后我有下面的代码期望只得到 10 条记录但令我惊讶的是,它是全部。
todos: Observable<TodoItem[]>;
constructor(private http: HttpServiceService) {
this.todos = this.http.get('https://jsonplaceholder.typicode.com/todos');
this.todos.pipe(
map((todoList) => todoList.map(todo => ({ ...todo, id: todo.id + 10 }))),
take(10)
).subscribe(val => console.log(val));
}
有人能解释一下为什么不用 10 条记录吗?我们怎样才能让它只获得 10 条记录?
提前谢谢你。
在您的示例中,api 调用将返回一个数组。它将返回作为数组的单个值。在您的流中将有一个值(单个数组),然后流结束。
所以 take(10) 在你的情况下不会做任何事情。如果您的流有多个值,则 Take 运算符将起作用,然后您在流结束之前对进入“订阅”块的值的数量进行一些“限制”。
所以你的问题的解决方案与 rxjs 无关,它是基本的 js 数组操作。
你可以回来
todoList.map(todo => ({ ...todo, id: todo.id + 10 })).slice(0, 10)
take
运算符从可观察对象中发出指定数量的值,然后完成。请在此处阅读有关 take 运算符的信息
在您的示例中,API 调用返回一个数组获取前 10 条记录,您可以这样做
this.todos = this.http.get('https://jsonplaceholder.typicode.com/todos');
this.todos.pipe(
map((todoList) => todoList.map(todo => ({ ...todo, id: todo.id + 10 }))),
map((todoList) => todoList.slice(0, 10))
)
.subscribe(val => console.log(val));