How can I determine the data type of an Array element contained within an Interface member?

Is there a way to extract the type of key3 in MyInterface2 and use it in key3Value, similar to key2Value?

interface MyInterface {
    key1: {
        key2: string
    }
}

const key2Value: MyInterface['key1']['key2'] = 'Hi' //Operates correctly

interface MyInterface2 {
    key1: {
        key2: Array<{ key3: string }>
    }
}

const key3Value: MyInterface2['key1']['key2']['key3'] = 'Hi' //Error: Property 'key3' does not exist on type '{ key3: string; }[]'.(2339)

Link to typescript playground.

arraystypescripttypes

Answer №1

Adding an index is necessary in order to access the specific value within the array:

const desiredValue: MyInterface2['key1']['key2'][0]['key3'] = 'Hello'

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

Vercel - Deploying without the need to promote the project

How can I deploy my Nextjs app to production in a way that allows me to run E2E tests on a "pre-prod" version before promoting it to prod, similar to using a preview URL without public traffic being directed there? I am looking for a process where I can v ...

javascripttypescriptnext.jsvercel

Reimagine server-side storage options as an alternative to remixing JavaScript local storage

My remix application is designed to serve as a frontend. I retrieve data from the backend and sometimes need to load specific data only once and reuse it across multiple pages. In our previous frontend setup, we utilized localstorage; however, with the cur ...

node.jstypescriptnpmtsxremix.run

Convert JSON object values into arrays - jq

Below is a snippet of an array containing objects with various properties: [{ "DATE": "10.10.2017 01:00", "ID": "X", "VALUE_ONE": 20, "VALUE_TWO": 5 }, { "DATE": "10.10.2017 02:00", "ID": "X", "VALUE_ONE": 30, "VALUE_TW ...

arraysjsongroupingjqbucket

Typescript service wrapper class returning Axios HEAD request

I am attempting to retrieve the header response using a custom Axios HTTP service wrapper. axiosClass.ts import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse } from "axios"; class Http { private instance: AxiosInstance | null = n ...

node.jstypescriptaxios

Verifying data types on combined function parameters

In the process of creating a function called getLocale(obj, key, locale), I aim to retrieve a specific locale from an object based on a given key. If the desired locale variant is not available, it should return a fallback option. While adding type checki ...

typescript

Transform the subscription into a string

When I use the http method to retrieve a single user, the output logged in the console looks like this: this.usersService.getOneUser().subscribe(data => { console.log(data) }); email: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data- ...

jsonangulartypescript

Issue with importing RxJS in an Angular 5 project

Help needed! I can't find Observable, how do I use rxjs on http? Can someone please provide guidance? import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { IEmployee } from '. ...

typescriptrxjsangular5

Python program to iterate through a matrix and verify the presence of each value in a vector

For my analysis, I have created a vector called possibleGrades containing the values [-3, 0, 2, 4, 7, 10, 12]. Now, I need to identify which cells in a given matrix do not correspond to any of these grades from the vector: [[ 7. 7. 4. ] [12. 10. 10 ...

pythonarrayspandasnumpyvector

Unsure about the commit hash referenced in the tsd.json file

Explore the history of angular-ui-router d.ts file using the commit hash Within my tsd.json file, I have the following details: { "version": "v4", "repo": "borisyankov/DefinitelyTyped", "ref": "master", "path": "typings", "bundle": "typings/tsd ...

angularjstypescript

Tips for identifying the load window in Ionic 2 RC3 Angular 2

In the various services that I am using, I implement a method to load content. Each service has its own loadController to display a loading window. How can I detect if a loading window already exists in order to prevent showing a new one? *Please note: I ...

angulartypescriptionic2

TypeScript: Unidentified reference to 'this' within the class

typescript version: 3.9.2 The goal is to define an interface constraint that permits only non-functional member keys on the class type NonFunctionKeys<T extends {}> = { [K in keyof T]-?: T[K] extends Function ? never : K }[keyof T]; class MyClas ...

typescriptclassthis

Is it possible to set up TypeScript npm packages to be installed in their original TypeScript format rather than JavaScript for the purpose of examining the source code?

Despite my lack of expertise in the inner workings of how a TypeScript library compiles itself to JavaScript before being placed in the node_modules directory, I have a question: Coming from a PHP background, I am accustomed to being able to explore any l ...

typescriptnpm

I am seeking guidance on extracting specific data from a JSON file and presenting it in an HTML table using jQuery

I am currently working on extracting specific elements from a JSON file and displaying them in an HTML table. I have successfully retrieved the data from the JSON file, stored it in an array, and then dynamically created an HTML table to display the conten ...

jqueryhtmlarraysjson

Ensuring the selected date matches any consecutive dates within the dates array in Angular

Imagine if 01/01/2022 is chosen from the input field, and my array of dates looks something like this: ['31/12/2021', '01/11/2021', '02/01/2022'...] In this scenario, when '31/12/2021' and '02/01/2022' are ...

htmlangulartypescriptvalidation

Steps for creating a vector list or an array of lists in Java

How can I create a vector array like this in both C++ and Java? vector<int> tab_u[255] I've tried the following method, but it doesn't seem to work: List<Integer> tab[] = new List[255]; My desired output would look something like ...

javaarrayslistvector

Handling events in React using TypeScript

Currently diving into the world of React with Typescript and encountered a challenge involving event handling using the onClick property. I have a react component displaying a list of items from an array, and I aim to log the clicked item in the console. I ...

reactjstypescriptevent-handling

Tips for effectively jasmine testing with the createSpyObj function, where class properties are defined as spies

When attempting to create a mock service with set-only properties, I encountered errors indicating that the value was undefined despite following the guidance in the documentation here. I want to be able to track the values of these properties during test ...

angulartypescripttestingjasmine

Struggling to access the "this.array" variable within a TypeScript-powered Angular 4 application

I cannot access the this.array variable in my TypeScript-Angular 4 application. The error is being thrown at this.services.push because this.services is undefined. My code looks like this: export class ServersComponent implements OnInit { //Initializi ...

javascriptjqueryangulartypescript

Empty nested Map in POST request

I am currently working on a springboot application with a React/Typescript frontend. I have defined two interfaces and created an object based on these interfaces. export interface Order { customer_id: number; date: Date; total: number; sp ...

javascriptjsonreactjstypescriptfetch

Oops! Looks like you forgot to provide a value for the form control named <name>. Make sure to fill

I have encountered an issue with a nested operation. The process involves removing an offer and then saving it again as a repeating one. However, the problem arises when I try to use patchValue() on the item in offerList[index] after saving the repeating ...

angulartypescript