Navigating through nested objects using Rxjs

How to Extract Specific Attribute Values from Nested Objects Array using RxJS

const obj = {
      name: 'campus',
      buildings: [
        {
          name: 'building',
          floors: [
            {
              name: 'floor'
            }
          ]
        }
      ]
    };

Is it possible to retrieve names in RxJS? Essentially, the desired output is [campus, building, floor]

Observable.of(obj).map((res) => res.name).subscribe((val) => console.log(val));

I am aware of how to achieve this without the use of RxJS. However, I am interested in learning how to accomplish this task using RxJS. Thank you in advance

Currently, my approach looks something like the code snippet below

const names = [];
    names.push(obj.name);
    obj.buildings.forEach((building) => {
      names.push(building.name);
      building.floors.forEach((floor) => {
        names.push(floor.name);
      });
    });
    console.log(names);

Answer №1

this code should function as expected:

getNames(obj) {
    const names = [];
    names.push(obj.name);
    obj.buildings.forEach((building) => {
      names.push(building.name);
      building.floors.forEach((floor) => {
        names.push(floor.name);
      });
    });
    return names;
}

Observable.of(obj).map((res) => this.getNames(res)).subscribe((val) => console.log(val));

You're basically changing one value to another in a straightforward manner. The concept of reactive programming is more suited for handling streams of values over time rather than solitary values. In this case, since you are working with a single value, it's best to keep things simple and direct instead of complicating the process by trying to adhere strictly to reactive principles. If your objective was to gather "name" properties from multiple objects across different instances, then using reduce or scan would be more appropriate.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The Typescript object may be null even with its initial value set

1: let a: Record<string, any> | null = {}; 2: a['b'] = 2; Encountered the TS2531: Object is possibly 'null' error on Row 2 despite having an initial value. To address this issue, the code was updated as follows: 1: let a: Record ...

What is the reason for typescript's lack of a "function" type?

As a newcomer to TypeScript, I'm puzzled as to why I am unable to define an object like this: const obj: { property1: string property2: boolean property3: function } It seems that the only workaround is to use: const obj: { property1: strin ...

Creating an interface for a class instance through the implementation of a class constructor

I am working on an application where developers can specify which component they want to render a certain part. I need users to understand that they must implement an interface, but I'm struggling with correctly writing the typing. export interface I ...

There seems to be an issue with the authorization function in nextauthjs utilizing TypeScript

In my NextJS application utilizing nextAuth with TypeScript, I am encountering difficulties implementing the credentials provider. Below is a snippet from my api\auth\[...nextauth]\route.ts file: CredentialsProvider({ name: 'cre ...

Adjust the page URL during execution of a Protractor test

When conducting my protractor tests, I encountered a scenario where I needed to perform an action on page1 and then navigate to page2 in the same test script to verify the results. describe('something', function() { describe('foo', f ...

Ways to Halt observable.timer in Angular 2

As I work on Angular2's Component, I am currently implementing the following functions: export class MypageEditComponent { ngOnInit() { this.timer = Observable.timer(100, 100); this.timer.subscribe(t => { this.setFormData(); } ...

A guide on implementing Angular-DataTable within a TypeScript project

Hey everyone, I'm currently working on a TypeScript and Angular application. To create a data table, I decided to use Angular-DataTable. After creating a sample application using it, I added the following code to my Controller: constructor(protecte ...

Using TypeScript to define a constant array as a type

I've hit a roadblock in my typescript project while trying to define a suitable type. Here's the setup: Within my project, I have the following constant: export const PROPERTYOPTIONS = [ { value: "tag", label: "Tag" }, { ...

Passing events from a parent component to dynamically created child components in Angular

UPDATE: I've decided to tackle this issue in a different way by retrieving dynamic child component values in the parent component's save() function, following the accepted answer. I am attempting to create a system where a parent component emits ...

The Angular HTML component is failing to display the locally stored JSON data upon page initialization

import { Store,STORES } from '../models/store'; export class StoreLocatorComponent implements OnInit { public Stores: any = []; constructor() { } ngOnInit(): void { this.Stores = STORES ; this.Stores.forEach(element => { ...

The Alert dialog in Shadcn will automatically close upon clicking the trigger from the dropdown menu

It seems like other people have encountered this issue, but they all used the alert dialog in the same file. I attempted to open the alert dialog using "" and included a dropdownmenuitem with 'delete' inside it. However, when trying to open the ...

Utilize string variables within TypeScript's enumeration feature

Can string variables be used in enums in TypeScript? Strings can be used in enum like so: enum AllDirections { TOP = 'top', BOTTOM = 'bottom', LEFT = 'left', RIGHT = 'right', } However, trying to use variab ...

Processing dates with NestJS

I am trying to format a date string in my NestJS API from 'YYYY-mm-dd' to 'dd-mm-YYYY', or even better, into a date object. Unfortunately, the NestJS framework does not seem to recognize when Angular sends a Date as well. Should I be se ...

Merging an assortment of items based on specific criteria

I have the following TypeScript code snippet: interface Stop { code: string } interface FareZone { name: string; stops: Stop[]; } const outbound: FareZone[] = [{name: 'Zone A', stops: [{ code: 'C00'}] }, {name: 'Zone B ...

Encountering an issue with NextJS 13 when utilizing the vectorstore recommended by Langchain, specifically receiving an error message stating that HNSWLib

Currently, I am building an application utilizing Langchain and OpenAI for assistance. My approach involves loading data using JSONLoader and intending to save it in a vectorstore. This way, I can provide specific answers to user queries based on the store ...

Transforming the string attribute of an object within a JavaScript array through mapping

Here is an array of objects: { "attr1": 123, "attr2": "a.end", }, { "attr1": 123, "attr2": "b.start", } The task is to remove the first part of the attr2 string up to and including the '.& ...

Displaying multiple lines in an alert box using Angular 8

I need assistance in displaying an alert message when the user selects a checkbox. We have a shared alert service component that is being utilized by every module. My current code snippet is as follows: if(this.checkboxvalue) { this.al ...

Can you explain the distinction between the navigate function and routerLink feature in Angular 2?

As I go through the official Angular 2 tutorial, I noticed that it demonstrates using the navigate function in a way similar to routerLink. Can you explain the differences between these two methods and when it is best to use each? this.router.navigate([ ...

Issue with setting cookies in Node.js using Express

Recently I made the switch from regular JavaScript to TypeScript for my project. Everything seems to be functioning properly, except for session handling. This is the current setup of my project: Server.ts App.ts /db/mongo/MongoHandler.ts and some other ...

What could be causing my controller method in TypeScript to throw an error message unexpectedly?

Hey there. I'm diving into TypeScript and currently working on converting an Express backend to TS. Everything was smooth sailing until I encountered some unexpected issues. Specifically, the lines const hasVoted = poll.votedBy.some((voter): boolean = ...