What is the method for retrieving the type of a property within a nested type situated beneath an indexer?

Question

What is the method for retrieving the type of a property within a nested type situated beneath an indexer?

Given:

interface Example {
    items: {
        [k: string]: {
            name: string;
            value: {
                subName: {
                    subValue: string;
                };
            };
        };
    };
};

If we create a type for items using a lookup type as follows:

type Items = Example['items'];

However, what if the goal is to obtain the type of the object below the indexer?

type SubItems = Example['items']['']['value'];

The approach above may not be successful. Is there a method to access the type of the value object?

typescript

Answer 1

Answer №1

Here is a functioning solution:

type SubItems = Example["items"][string]["value"];

Answer 2

Here is a functioning solution:

type SubItems = Example["items"][string]["value"];

Answer 3

Answer №2

If you want to access it in a hierarchical manner, take a look at this example:

interface Sample {
    elements: {
        [k: string]: {
            label: string;
            data: {
                subLabel: {
                    subData: string;
                };
            };
        };
    };
}

var sample = {
  elements:{
    'element':{
      label:'A',
      data:{
        subLabel:{
          subData:'B'
        }
      }
    }
    } 
} as Sample

console.log(sample['elements']['element']['data']['subLabel']['subData']); // B

Answer 4

If you want to access it in a hierarchical manner, take a look at this example:

interface Sample {
    elements: {
        [k: string]: {
            label: string;
            data: {
                subLabel: {
                    subData: string;
                };
            };
        };
    };
}

var sample = {
  elements:{
    'element':{
      label:'A',
      data:{
        subLabel:{
          subData:'B'
        }
      }
    }
    } 
} as Sample

console.log(sample['elements']['element']['data']['subLabel']['subData']); // B

Answer 5

Answer №3

Try approaching it from a different angle. Be sure to define your data types explicitly:

type PersonDetails = {
    name: string;
    age: number;
}

type Address = {
    street: string;
    city: string;
    zipcode: string;
}

interface ContactInfo {
    person: PersonDetails;
    address: Address;
}

Answer 6

Try approaching it from a different angle. Be sure to define your data types explicitly:

type PersonDetails = {
    name: string;
    age: number;
}

type Address = {
    street: string;
    city: string;
    zipcode: string;
}

interface ContactInfo {
    person: PersonDetails;
    address: Address;
}

What is the method for retrieving the type of a property within a nested type situated beneath an indexer?

Answer №1

Answer №2

Answer №3

Similar questions

What is the reason for my Firestore listener consistently retrieving data from the server despite having offline persistence enabled?

Error TS2345: The type '{ type: "mouseWheel"; }' cannot be assigned to the parameter of type 'MouseInputEvent | MouseWheelInputEvent | KeyboardInputEvent'

What advantages does subscribe() offer compared to map() in Angular?

What is the method for including word boundaries in a regex constructor?

Removing empty options from a select dropdown in Angular 9

Replacing TypeScript declarations enhanced by external libraries

Sortable layouts and tables in Ionic 3

Access information from an http URL using AngularJS

The HttpInterceptor is programmed to identify and capture 401 error responses

Issue arises from an absent property in the lib.dom.d.ts file following an update to the most recent TypeScript version

Struggling with rotating an image in React

Reactive angular form validation issues upon initial click

Utilizing memoizee in TypeScript's object-oriented programming

The 'dateEmail' and 'dateSigned' properties are not found in the 'never' type

How to configure intellisense for a webpack bundle in an ASP.NET Core project

The error encountered during parsing the module for Next.js, Webpack, and TypeScript files (.ts, .tsx) was due to an unexpected token

Setting the useState hook to a User type in React - the ultimate guide!

Creating formGroups dynamically for each object in an array and then updating the values with the object data

How to make an HTTP request in Angular 7 before the browser is closed

Clicking on a component in Nuxt will trigger it to open