RxJS可观察的过滤和分组
RxJS是一个用于构建基于事件流的异步和基于事件的程序的库。它提供了一种简洁而强大的方式来处理异步数据流，并且可以轻松地实现过滤和分组操作。
RxJS中的可观察对象（Observable）是一个表示未来值或事件的集合。通过使用操作符，我们可以对这些可观察对象进行过滤和分组操作，以满足特定的需求。
过滤操作是指根据特定的条件从可观察对象中选择出符合条件的值或事件。RxJS提供了一系列的过滤操作符，如filter、take、skip等。其中，filter操作符用于根据指定的条件过滤出符合条件的值或事件。
分组操作是指将可观察对象中的值或事件按照特定的规则进行分组。RxJS提供了groupBy操作符，它可以根据指定的键将可观察对象中的值或事件进行分组。分组后的结果是一个可观察对象的集合，每个可观察对象代表一个分组。
RxJS的过滤和分组操作在许多场景中都非常有用。例如，在处理实时数据流时，我们可以使用过滤操作符来过滤掉不需要的数据，只保留感兴趣的数据。而在处理大量数据时，我们可以使用分组操作符将数据按照特定的规则进行分组，以便更好地进行处理和分析。
腾讯云提供了一系列与RxJS相关的产品和服务，可以帮助开发者更好地利用RxJS进行开发和部署。其中，腾讯云函数（SCF）是一种无服务器计算服务，可以让开发者无需关心服务器的管理和运维，只需编写函数代码即可实现对RxJS的过滤和分组操作。您可以通过腾讯云函数来实现对RxJS的过滤和分组操作，并将结果存储到腾讯云数据库（TencentDB）中进行后续分析和处理。
更多关于腾讯云函数和腾讯云数据库的信息，请访问以下链接：
请注意，以上答案仅供参考，具体的产品选择和使用方式应根据实际需求和情况进行决策。
相关·内容
用地图和过滤器迭代array的正确方法是什么？目前，两家公司都期望有单一的价值。但是我的Observable有数组。请告诉我正确的方法。
这是我的ts：
import { Component, OnInit } from '@angular/core';
import { Observable, of } from 'rxjs';
import { filter, map, tap} from 'rxjs/operators';
@Component({
selector: 'my-app',
templateUrl:
浏览 1提问于2021-10-07得票数 0
回答已采纳
1回答
考虑一个简单的情况，您需要过滤一个数组。在角度和rxjs的上下文中，我们可以使用JS filter方法和RxJS filter运算符。
//JS filter
let array = ['1', '2', '3', '4']
let result = array.filter(x => x == '2')[0];
//RXJS filter
const p = from(array);
let result: any;
p.pipe(filter(x => x == '2')).sub
浏览 1提问于2018-08-28得票数 0
2回答
我正在学习角和RxJS操作符。我正在使用Hearthstone来训练它。我做错什么了？我想过滤流只返回“萨满”牌。我知道，阿皮给了我机会，让我在课堂上得到卡片，但我只想培训RxJS，所以我正在考虑这个问题。我的ts组件：
cards: Card[];
ngOnInit() {
this.cardsService.getCards().pipe(
filter((el: any) => el.playerClass === 'Shaman')
).subscribe(res =>
this.cards = res);
浏览 0提问于2019-02-19得票数 2
回答已采纳
以前我使用的是rxjs-5，我使用的是observable.partition，如下所示：
const [isTiming$, isNotTiming$] = this.store.select(state => state.tetris.isTiming)
.partition(value => value);
升级angular到8之后，rxjs升级到rxjs-6，开始抛出以下错误：
providers/timer.provider.ts(27,5): error TS2339: Property 'partition' does not ex
浏览 1提问于2019-06-15得票数 3
回答已采纳
我得到了这个错误。我在试着用 import { catchError } from 'rxjs/operators' 而不是 import 'rxjs/add/operator/catch' 但是如何使用rxjs/add/operator/do和rxjs/add/operator/toPromise的instaed呢
浏览 9提问于2020-10-07得票数 3
我是rxjs新手~
我在学习rxjs..。我故意试图犯一个错误。
但是，没有输出错误消息和“完成！”是输出的。
为什么.？
(我编写并运行了这段代码)
// 4, 8, 1, 14, A, 7
const { of } = rxjs;
const { tap, filter } = rxjs.operators;
const obs$ = of(4, 8, 1, 14, 'A', 7);
const subscriber = {
next: x => console.log(x),
error: err => console.log('e
浏览 2提问于2021-10-14得票数 0
回答已采纳
1回答
我刚刚开始研究RxJS，并试图把我的注意力集中在filter上。
从外表上看，没什么可查的，我知道？
这就是我拥有的-
declare interface App {
id: string;
bId: string;
account: string;
title: string;
platform: string;
isLive: boolean;
}
public allApps: Observable<App[]>;
this.allApps = this.httpClient.get(`${UtilitiesService.APIRoot}/glob
浏览 1提问于2019-06-13得票数 1
回答已采纳
https://rxjs-dev.firebaseapp.com/api/ajax/ajax 为什么rxjs ajax操作符返回一个Observable？我认为一个请求返回一个响应，连接就结束了。为什么它是可观察的，而不是单个响应消息？
浏览 13提问于2020-03-30得票数 1
回答已采纳
我正试图对RxJs操作符groupBy的用例进行研究，我担心在某些情况下它可能会导致内存泄漏。
我熟悉传统意义上的groupBy (例如同步列表处理)。我将编写一个groupBy函数来引用：
const groupBy = f => list =>
list.reduce((grouped, item) => {
const category = f(item);
if (!(category in grouped)) {
grouped[category] = [];
}
grouped[category].push(item
浏览 0提问于2018-04-05得票数 5
回答已采纳
所以，基本上，rxjs是新的，想知道，
我是否需要从Observable.of(数据)或更新的rxjs版本中取消订阅(数据)？
即
import {of} from 'rxjs';
const sub = of(data).subscribe();
这有必要吗？
sub.unsubscribe();
浏览 2提问于2019-04-28得票数 6
我在我的服务文件中调用了一个名为getWorkOrders()的方法，该方法又调用服务器来获取记录。
这是我的服务。我正在使用新的HttpClient。
export class BackendServices {
private BASE_URL ='http://localhost:3000/backend';
constructor(private http: HttpClient) {}
getWorkOrders(){
return this.http.get(this.BASE_URL + '/getworkorders/');
浏览 0提问于2018-05-17得票数 14
回答已采纳
2回答
在我的项目中有许多使用异步/等待的代码。但是我想把所有的代码都转到rxjs代码上。
但我不习惯用rxjs。请告诉我将异步/等待代码转换为rxjs的模式或方法。或者请推荐一个例子。
这是我的原始代码(使用异步/等待)
this.userHistory$ = new Subject();
async getUserStatue(userId, query){
const userData = await this.UserApi.getUserInfo(userId, query);
this.userHistory$.next(userData);
}
下面的代码是我试图使用rxjs
浏览 7提问于2022-05-16得票数 0
3回答
我想得到一个可观察的结果，并做一些更改，然后返回的结果与类型的可观测再次为组件订阅。这是我的密码：
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
import 'rxjs/add/observable/of';
import {Observable} from 'rxjs/Observable';
get_items() {
this.http.
浏览 1提问于2018-06-20得票数 3
回答已采纳
我有两个rxjs对象：
public documents: BehaviorSubject<ApplicationExistingRelationShips[]> = new BehaviorSubject<ApplicationExistingRelationShips[]>([]);
public filteredDocuments: BehaviorSubject<ApplicationExistingRelationShips[]> = new BehaviorSubject<ApplicationExistingRelationS
浏览 2提问于2020-10-05得票数 0
回答已采纳
事实上，我确实试图找到一个类似的问题，因为我发现我很难接受以前没有人问过这个问题(尽管它可能是反模式的)。让我们从这一组成部分开始：
@Component({...})
export class MyParent {
myGroups: Observable<Array<MyItemGroup>>;
}
其中MyItemGroup是：
export class MyItemGroup {
groupDisplayName: string;
group: Observable<Array<MyGroupedItem>>;
}
浏览 3提问于2017-12-21得票数 2
回答已采纳
在一个Range5项目中，我试图处理，但不明白在导入分离的operators时它是如何工作的。
fromPromise 考虑将与 map**:**链接起来
import { fromPromise } from 'rxjs/observable/fromPromise';
import { map } from 'rxjs/operator/map';
使用fromPromise().map()返回错误：fromPromise_1.fromPromise(...).map is not a function
和
import 'rxjs/add/obs
浏览 1提问于2018-03-19得票数 0
回答已采纳
5回答
我正在迁移一个角形5应用程序到最新的CLI和Range6RC，并且我所有的可观察到的导入都被破坏了。我看到了角度6改变了导入的工作方式，但是我找不到任何关于语法是如何工作的明确的参考。
我5岁的时候就有了这个，效果很好：
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
现在使用新的语法，
浏览 0提问于2018-04-13得票数 42
回答已采纳
2回答
我有一些代码，在那里我可以观察到。我想改变数组过滤方法来过滤rxjs。如何使用rxjs的filter运算符？
@Input() public articleTags: Observable<ALArticleTag[]>;
public selectedArticleTags: ALArticleTag[] = [];
public ngAfterViewInit(): void {
this.articleTags.pipe(
take(1),
map(tags => {
re
浏览 5提问于2019-10-29得票数 2
4回答
我尝试在我的角6项目中导入rxjs计时器，如
import { timer } from 'rxjs/observable/timer';
我也试过，
Rx.Observable.timer(200, 100)
它们不起作用
以下是上的代码
浏览 0提问于2018-05-08得票数 19
回答已采纳
当我使用rxjs-fetch向GroupObservable添加信息时，它会耗尽。(在空的可观察对象上进行进一步的映射操作)
让代码说话：
import Rx from "rxjs";
import rxFetch from 'rxjs-fetch'
import chai from "chai";
const expect = chai.expect;
describe('General', () => {
it('combine group and rxfetch', (done)=>{
浏览 3提问于2019-02-20得票数 0
在角13库中，将rxjs升级到version 7的最佳方法是哪种？使用rxjs6的项目仍然可以使用该库。
我注意到，在从rxjs6升级到rxjs7时，没有像我用于从rxjs 5升级到rxjs 6那样的兼容性库。
我想独立地更新项目和库，但是rxjs6和rxjs7不兼容。
浏览 32提问于2022-05-09得票数 2
回答已采纳
4回答
从角4升级到7，造成问题
、、、、
我已经将我的项目从Angular 4升级到了Angular 7，并且我得到了以下错误：
node_modules/@ng-bootstrap/ng-bootstrap/typeahead/typeahead.d.ts(3,10)：错误TS2305中的错误:模块'"D:/usman/dev_area/code/physician-portal/node_modules/rxjs/Observable"‘没有导出成员“可观察”
node_node/rxjs/观测点.d.ts(1，15)：错误TS2307:无法找到模块‘rxjs-compat/可观测
浏览 0提问于2019-05-17得票数 4
回答已采纳
1回答
我们在Rxjs中使用了 filter 操作符来根据条件过滤可观察到的项。
Of(1,2,3).pipe( filter(item = item >= 2) )
在这里，我们可以过滤>=2发出的数字，得到(2,3)
在订阅项目之后，我可以在相同的条件下进行筛选。Of(1,2,3).subscribe((items)=>{ items = items.filter(item=>item>=2); } )
如果在订阅后可以这样做，那么在Rxjs中操作符过滤器的真正意义是什么？
浏览 5提问于2022-07-29得票数 0
1回答
最近，我一直试图在一个react应用程序中使用rxjs来提取API请求，这就是我想出的解决方案。
你对这件事的看法如何？
我是否应该跟进一些好的做法呢？
如果有什么好的解决办法，请告诉我。
import axios from 'axios';
import { Observable } from 'rxjs';
import './App.css';
export class App extends Component {
state = {
users: []
};
componentDidMount() {
c
浏览 2提问于2020-03-01得票数 0
2回答
我一直在学习rxjs和反应式编程，但有一些东西我还不太理解。例如，我希望在一个简单输入上获得keyup事件的结果，映射它，并将映射结果设置为另一个div内容：
const root = $('#root'),
input = root.find('#some-input'),
result = root.find('#result');
使用rxjs，我可以做到：
const keyupObs = fromEvent(input, 'keyup');
const mapper = keyupObs.pipe
浏览 1提问于2019-12-13得票数 3
在RxJS中，可观测实例的catch方法和onErrorResumeNext方法似乎几乎没有区别，除了onErrorResumeNext将原始可观测参数与可观测参数连接起来之外，无论是否发生错误。
如果是这样的话，命名是不是有点混乱？因为在出现错误的情况下，onErrorResumeNext的工作方式与catch完全相同：
var testObservable = Rx.Observable.return(1).concat(Rx.Observable.throw("Error"))
// Both onError and onCatch will emit the same
浏览 2提问于2014-10-29得票数 8
回答已采纳
我写了一段代码过滤搜索。我的错误是error TS2339:在'Observable<Employee[]>'类型上不存在属性'filter‘。下面是我的代码的样子。
import { Component, OnInit } from '@angular/core';
import { Observable } from "rxjs";
import { Router } from '@angular/router';
import { Employee } from '../../employee&#
浏览 2提问于2021-04-04得票数 1
1回答
我正在学习rxjs，并努力理解window方法。我读了很多次，我很怀念那种顿悟的效果。
有人能给我解释一个非常简单的例子，我如何使用window方法，在什么情况下我可以使用它。
浏览 1提问于2016-12-26得票数 1
我正在探索RxJS库，并且非常喜欢使用可观察的而不是承诺。但是，是否有人能提供关于使用
Observable.First
Observable.Single
将筛选器应用到只返回单个项的方式。
在这个图书馆里有什么特别的需要？
浏览 5提问于2016-12-22得票数 7
回答已采纳
我对nestJS和RxJS很陌生，并尝试为http请求使用axios。
我注意到在使用API时有两个选项。
使用HttpService.get。它返回可观测值，而together.using HttpService.axiosRef.get应该使用RxJS。它还承诺。
两个选项之间有什么区别？？
(例如)性能，捕捉错误。等等..。
谢谢。
浏览 15提问于2022-07-26得票数 0
回答已采纳
3回答
结构由API返回。
这是签名
methodApi(): Observable(Array<MyClass>)
这是数据
{ id: 1, name: 'Red', parentId: null }
{ id: 2, name: 'Apple', parentId: 1 }
others
我想把它按parentId分类
methodApi()
.pipe(groupby((x: MyClass[] => ...))) // THERE
.subscribe(x => console.log(x));
MethodApi在“groupby”方
浏览 1提问于2020-07-13得票数 3
回答已采纳
我对rxjs和redux-observable非常陌生。我尝试在一个epic中发出两个ajax请求，如下所示： import { mergeMap, filter, map, catchError } from 'rxjs/operators';
import { of } from 'rxjs';
import { ofType } from 'redux-observable';
import { push } from 'connected-react-router';
export const doSomethin
浏览 14提问于2020-03-24得票数 1
我已经将this.userrights替换为userrights$ observable： public userrights$: Observable<UserRight[]>; 在此之前，通过单击事件从模板中调用了filter方法： filterState(state: UserRightState) {
this.userrights = this.clonned.filter((st: UserRight) => (this.filterBy == state ? true : st.value === getRightStateValue(state)))
浏览 26提问于2021-11-02得票数 0
回答已采纳
嘿，我是下一个我的角度，我和一个团队一起工作，他们使用非常老的角度，我试图升级很多东西，我以前的rxjs是在5.4版本，现在我升级到6.5地图，捕捉和抛出不再接受，我读了一些文章也是如何转换它们，但仍然不清楚，因为大多数文章没有解释如何得到json()的回应。
下面是我以前的rxjs5.4语法
import { Observable } from "rxjs/Observable";
import "rxjs/add/operator/catch";
import "rxjs/add/operator/map";
import "rxjs
浏览 0提问于2019-05-23得票数 0
可以从rxjs和rxjs/操作符导入combineLatest函数。
当我从rxjs/操作符导入它时(就像导入combineAll一样，我得到以下错误：
TS2339: Property 'subscribe' does not exist on type 'OperatorFunction<{}, [{}, number, number, number]>'
我使用了以下代码片段：
import { timer } from "rxjs";
import { combineLatest } from "rxjs/operat
浏览 0提问于2018-10-23得票数 4
回答已采纳
2回答
如何处理redux中的异步函数？
、、、、
我使用的是RxJS和redux-可观测的。
我正试着读史诗中的文件。在我的例子中，我必须在epic中这样做，因为其他一些史诗触发了expand操作符多次“未知”的史诗。
但是由于FileReader是异步的，下面的代码不能工作。
什么是正确的方法，尤其是RxJS处理这个问题的方法？谢谢
export const uploadAttachmentEpic = (action$, store) =>
action$
.ofType(UPLOAD_ATTACHMENT)
.map(action => {
const reader = new FileRea
浏览 1提问于2017-11-27得票数 1
回答已采纳
1回答
我有可观察的，主题等等，多亏了rxjs，
很好，我不需要异步/等待：
我的问题是，做rxjs的人是怎么做的？
他们是使用异步函数来创建他们的库，还是找到了一个更好的解决方案？
如果他们确实使用了这个函数，这就意味着，例如，我不能使用和rxjs，对吗？
浏览 0提问于2019-09-04得票数 0
回答已采纳
2回答
我用的是rxjs和打字本。我写了两个简单的函数。但我想rxjs已经具备了这样的功能。rxjs
export function isObservable(value: any): value is Observable<any> {
return value instanceof Observable;
}
export function createObservable<T>(value: T | Observable<T>): Observable < T > {
return isObservable(value) ? value
浏览 4提问于2017-06-08得票数 1
回答已采纳
我知道rxjs和definition的定义和职责，但是我想知道:当我在我的项目中使用rxjs时，我能抛出lodash吗？因为rxjs可以同步和异步地工作(异步和同步数据)。我认为这可以作为房客的另一种选择。我说的对吗？
浏览 1提问于2018-12-30得票数 7
回答已采纳
1回答
我有一个返回一个令牌的服务，还有许多订阅者调用这个服务并尝试获取这个令牌。如果我已经有令牌在内存中，我只是返回它，如果没有-提出新的请求，保存令牌，并返回可观察到的这个令牌。
一个时间内多个服务呼叫的问题。因此，其中一些订阅者接收到了不同的令牌。在RxJs中可能存在某种方式，以便先为每个请求创建某种查询，然后等待响应并向所有订阅者发送值？
我对任何帮助都会很合适的。谢谢。
浏览 5提问于2016-06-30得票数 1
回答已采纳
我想要过滤从API中得到的名字列表。我想用过滤器操作符这样做。但我知道这个错误：
> Property filter is not available for type Observable<any>
尽管进口
import { map, filter } from 'rxjs/operators';
我以乔希·莫罗尼的教程为指导：
我的守则：
service.ts
getList(): Observable<any> {
return this.http.get(this.url);
}
page.ts
publ
浏览 2提问于2019-11-04得票数 0
回答已采纳
在角2中使用rxjs时，import { Observable } from 'rxjs/Observable'和import { Observable } from 'rxjs'之间有什么区别吗？
浏览 2提问于2017-02-07得票数 10
回答已采纳
我正在从api(在服务文件中)获取数据，并且在ts文件中订阅。我没有使用rxjs(observable和subscription) .I对于在angular 7中不使用rxjs时是否需要取消订阅感到困惑。如果需要取消订阅，那么如果不使用rxjs，我们如何才能取消订阅
// ts
export class ViewDataComponent implements OnInit {
regions: Region[];
dataSource: MatTableDataSource<PaginatedMapData>;
constructor(private
浏览 2提问于2019-08-06得票数 0
我无法理解dc组的图表。这样，一个过滤器中的变化就会反映在其他所有过滤器中。我有一个简单的代码和两个系列图表。当我在一个上画画笔时，它不会过滤另一个。不知道为什么？有谁能快速查看一下小代码并提出建议吗？
d3.csv("data/compareData.txt", function(data) {
ndx = crossfilter(data);
runDimension = ndx.dimension(function(d) {return [+d3.time.format.iso.parse(d.timestamp), +d.meterid]; });
fre
浏览 2提问于2014-04-06得票数 1
回答已采纳
我搞错了
当我转到localhost:8080时，“EmptyError:没有序列中的元素”错误。
我看过的线程，但似乎没有一个答案适用。
我有"rxjs": "^5.5.6"，在我的路由中，我尝试添加pathMatch: 'full',，但错误仍然显示。
我的应用程序选择模块的摘录
const routes: Routes = [
{
pathMatch: 'full', /* added recently for test purposes*/
path: '',
浏览 16提问于2018-06-23得票数 9
2回答
在角应用程序中，从服务器获取数据有不同的方法：
从服务中获得可观察性，并在组件上订阅它
在服务中创建主题，在组件上订阅主题
这两种方法都适用于我，但我不知道该用哪种方法。
First method.从服务中获得可观察性，并在组件上订阅它
article.service.ts
import { Injectable } from '@angular/core';
import { Article } from '../models/article';
import { AngularFirestore } from '@angular/fi
浏览 0提问于2019-08-24得票数 3
回答已采纳
4回答
我有一个数组，我需要使用这个数组的非常单一的数据集发出单个请求。我发现难以解决的问题是如何安排呼叫。意味着，只有当一个请求完成时，下一个请求才会开始。我正在寻找一个RxJs队列，但我不能简单地找到解决方案。 示例： function makeRequest(body): Observable<any> {
return someAsyncRequest(body);
}
array.forEach((entry) => {
makeRequest(entry);
});
// This is just an example how the setup is
浏览 29提问于2019-11-20得票数 2
回答已采纳
我正在学习编写一个rxjs操作符，当我这样写的时候：
function map<T, R>(project: (value: T) => R): OperatorFunction<T, R> {
return function mapOperation(source$: Observable<T>): Observable<R> {
if (typeof project !== "function") {
throw new TypeError("argument is not a funct
浏览 35提问于2020-02-29得票数 2
回答已采纳
1回答
我正在做一个用角cli引导的角形2项目。我需要第一批货超快。这就是为什么试图减少所有的捆绑大小。
让我头疼的是rxjs库，因为它显着地增加了包的大小。我正在寻找进口诡计的树木摇动工作，进一步减少块大小。我在导入时使用了vscode的建议，它们在编写代码时工作，但是在构建cli时显示了无法解决这些路径的错误。
这不管用
import { of } from 'rxjs/observable/of';
我不得不求助于
import { Observable } from 'rxjs/Rx';
是否有另一种方法来导入特定的操作符。
浏览 0提问于2018-04-07得票数 0
回答已采纳
1回答
角5用httpget填充空数组
、、、、
我有一个空数组(ProductsWithCategory)，我试图在单击事件中填充它。但它并不适用于第一次点击。当我单击一次时，数组不会填充。在第一次点击之后，一切都正常。但我真的不知道为什么。你能帮帮我吗?
对不起我的英语。
category.component.html :
<h4 class="page-header">Categories</h4>
<div class="row">
<div class="col-lg-3">
<div class="list
浏览 0提问于2018-03-16得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
