将元素添加到 rxjsBehaviorSubject 或 Angular2+ 中数组的主题

2024-01-16

我正在阅读本教程的“不相关组件:与服务共享数据”部分,了解如何在 Angular 中的不相关组件之间共享数据here https://angularfirebase.com/lessons/sharing-data-between-angular-components-four-methods/.

我看到这个示例如何适用于他们试图在组件之间共享的字符串,但我的数据类型有点复杂:

也就是说,我认为我的BehaviorSubject 应该如下所示:

private currentPopulationSource: BehaviorSubject<Population> = new BehaviorSubject<Population>(new Population(new Array<Organism>()));

我的人口模型只是一系列有机体的容器:

import { Organism } from './organism.model';

export class Population {
  private individuals: any;
  constructor(individuals: Organism[]){
     this.individuals = individuals;
  }

  getIndividuals(){
    return this.individuals;
  }
}

我有一个 Organism 实例,我们将其称为organism1。

我想将其添加到包含在 Population 模型中的个体数组中,并且我希望多个不相关的组件订阅populationBehaviorSubject(我目前有private currentPopulation = this.currentPopulationSource.asObservable();在我的 PopulationManagerService 中,就在我声明 currentPopulationSource 之后,正如我在教程中看到的那样)。

我不清楚将有机体1 添加到我的 currentPopulationSource 的语法是什么(.next()这里似乎没有意义)。

如果我想要发出一个不断增长的数组,也许BehaviorSubject 不是最合适的选择?如果有更好的选择(ReplaySubject?),我不太知道如何实现它。

我的人口经理服务:

import { Injectable } from '@angular/core';
import { Organism } from './organism.model';
import { Population } from './population.model';
import { BehaviorSubject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class PopulationManagerService {
  private currentPopulationSource: BehaviorSubject<Population> = new BehaviorSubject<Population>(new Population(new Array<Organism>()));
  currentPopulation = this.currentPopulationSource.asObservable();
  constructor() { }

  addOrganismToPopulation(organism: Organism){
    this.currentPopulationSource.next(new Population(new Array<Organism>(organism))); //This does not work
    // this.currentPopulation.getIndividuals().push(organism); //This did not work either, because currentPopulation is of type Observable<Population> rather than of type Population
  }
}

在我的组件中:

let testIndividual: Organism = this.individualGenService.makeIndividual("green", "blue");
    this.popManager.addOrganismToPopulation(testIndividual);
    this.popManager.currentPopulation.subscribe(results =>{
      console.log(results.getIndividuals()); //returns undefined
    });

当前返回未定义。

非常感谢您对这个问题的任何帮助。


如果我理解正确的话,您想要将一个新的生物体添加到种群对象内的生物体列表中。这同时使用了行为主体。

在您的示例中,您可以执行以下操作。

addOrganismToPopulation(organism: Organism){
    this.currentPopulationSource
        .pipe(take(1))
        .subscribe((population: Population) => {
            this.currentPopulationSource.next(
                new Population([...population.getIndividuals(), organism]))
            )
        });
  }

那么我们在这里做什么呢?为了向当前种群添加新的生物体,我们需要知道生物体列表。所以我们订阅了持有人口的可观察量。在订阅中,我们创建一个新的population实例。在创建新实例时,我们创建了一系列已知的生物体和新的生物体。然后我们将新的/更新的人口放入流中。

请注意,我只获取流的一个值,take(1)。这是因为当我们想要计算新的生物体列表时,我们只需要当前的种群。这也可以防止不必要的内存泄漏。这take一个事件过去后,操作员就会从流中取消订阅。

很难用最少的信息来判断行为主体是否适合您的用例。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将元素添加到 rxjsBehaviorSubject 或 Angular2+ 中数组的主题 的相关文章

随机推荐