What is the process for calling subjects dynamically in a service?

Question

What is the process for calling subjects dynamically in a service?

Do you have a service with the following subjects?

  subjectOne$ = new Subject<Partial<boolean>>();
  subjectTwo$ = new Subject<Partial<boolean>>();
  subjectThree$ = new Subject<Partial<boolean>>();
  subjectFour$ = new Subject<Partial<boolean>>();

If so, how can you dynamically call them from the component?

onToggle(number: string) {
    this.myService.subjectOne$.next(this.selected[number]);
  }

You mentioned doing the param inside next() but are unsure of how to call subjectXXXX$ dynamically. Any ideas on how to achieve that?

angular typescript rxjs

Answer 1

Answer №1

One approach could be to store subjects in a map and access them dynamically.

subjectMaps: {[key: string]: Subject<Partial<boolean>>} = {
    one : new Subject<Partial<boolean>>(),
    two : new Subject<Partial<boolean>>(),
    three: new Subject<Partial<boolean>>(),
    four : new Subject<Partial<boolean>>()
  }

To make accessing easier, create a service function that retrieves the subject by key:

subjectByKey(subjectKey: string): Subject<Partial<boolean>> {
    return this.subjectMaps[subjectKey];
  }

Then, call this function from your component like so:

onToggle(number: string) {
    this.myService.subjectByKey('one').next(this.selected[number]);
  }

Answer 2

One approach could be to store subjects in a map and access them dynamically.

subjectMaps: {[key: string]: Subject<Partial<boolean>>} = {
    one : new Subject<Partial<boolean>>(),
    two : new Subject<Partial<boolean>>(),
    three: new Subject<Partial<boolean>>(),
    four : new Subject<Partial<boolean>>()
  }

To make accessing easier, create a service function that retrieves the subject by key:

subjectByKey(subjectKey: string): Subject<Partial<boolean>> {
    return this.subjectMaps[subjectKey];
  }

Then, call this function from your component like so:

onToggle(number: string) {
    this.myService.subjectByKey('one').next(this.selected[number]);
  }

Answer 3

Answer №2

The question is a bit confusing to me, but I believe utilizing an object for the subjects could be a viable solution.

subjects = {
  1: new Subject<Partial<boolean>>(),
  2: new Subject<Partial<boolean>>(),
  ....
}

onToggle(number: string) {
    this.myService.subjects[number].next(/* insert desired value */);
  }

Answer 4

The question is a bit confusing to me, but I believe utilizing an object for the subjects could be a viable solution.

subjects = {
  1: new Subject<Partial<boolean>>(),
  2: new Subject<Partial<boolean>>(),
  ....
}

onToggle(number: string) {
    this.myService.subjects[number].next(/* insert desired value */);
  }

What is the process for calling subjects dynamically in a service?

Answer №1

Answer №2

Similar questions

Determine the Variable Type by Evaluating the Value of Another Variable

Using Ionic 2 to fetch JSON data and display it using ngFor

Arranging information within the Ngb-Accordion

Mastering the Proper Use of Bootstrap-Tagsinput in Angular2

When attempting to update a document using the PUT method in the MEAN stack, no changes are being applied

To utilize the range-datepicker package, make sure to first include it in your package.json

Encountering issues with Proxy functionality in the latest versions of Angular 13 and Spring Boot

Guide on utilizing jasmine's spy functionalityAlways remember to use the

Angular 5 arrays within arrays

Customize specific styles for individual divs one at a time (without the use of jQuery)

The JSX component cannot be 'FieldArray' at this time

Utilizing indexing for list data presentation in Angular instead of relying on property names

Angular/Typescript: develop a factory function that creates objects based on the parent class's properties

Learn how to bring a component into another component within Angular

Updating the data and processing results settings for Select2 in an Angular 2 application

Securing pathways in Next.js using middleware and Next-Auth

Convert the XML response from an API into JSON

Refreshing data with Angular 2 Observables

Tips for setting NgForm value within an Observable and verifying its successful implementation

What are the various methods for configuring an Angular application within Eclipse?