Styjun

I have my interface like this

export interface Details 
 Name: [
 First: string;
 Last: string;
 ];
 

I have a observable config variable

Configuration: KnockoutObservable<Details> = ko.observable<Details>();

and I would like to assign it a value in the constructor as follows -

config = 
 Name: [
 First: "ABC",
 Last: "DEF"
 ,
 
 First: "LMN",
 Last: "XYZ"
 ]
 ;

this.Configuration(config);

and I am getting an error:

Types of property 'Name' is incompatible and property '0' is missing
in type.

Type ' First:string; Last:string; []' is not assignable to type '[
First: string; Last:string; ]'

I don't have control on changing the interface as it is being used elsewhere. What is the correct way to initialize this config variable ?

Thanks in advance.

I came across the same issue and got around it by changing the interface to:

 interface Details 
 Name: 
 First: string;
 Last: string;
 [];
 

I know you may not want the interface changed but hope this helps for anyone that is in this situation.

In this type definition:

interface Details 
 Name: [
 First: string;
 Last: string;
 ];

Name is not an array at compile-time. It's a tuple with one element. Tuples in Typescript are allowed to have extra elements, but they can't have missing elements. As a 1-tuple, Name is essentially an array which must have at least one element.

However, in this value:

const config = 
 Name: [
 First: "ABC",
 Last: "DEF"
 ,
 
 First: "LMN",
 Last: "XYZ"
 ]
;

Since there is no explicit typing, the Name property here defaults to array type. Arrays can have any number of elements, including zero - which doesn't fit in a 1-tuple. Hence your error.

Your error can be fixed by giving the compiler a hint that your literal is actually a tuple:

const config: Details = Name: [..., ...] ;

If you do need to be able to take in an array of names, you'll have to do some casting, maybe something like this:

if (names.length > 0) 
 const config = 
 Name: names as Details['Name']
 ;
 Configuration(config);

(You could remove the if check if you can determine that the tuple was simply a mistake by whoever wrote the typings.)

Tuples reference:
https://www.typescriptlang.org/docs/handbook/basic-types.html

Updating the interface to following should fix the issue :

 interface Details 
 Name: Array<
 First: string;
 Last: string;
 >;
 

This error can come from incorrectly typing an array (like I just did):

myArray:[]; //Incorrect, results in error message of `Property '0' is missing in type`

myArray: Array<string>; //Correct

myArray: string[]; //Also correct

The reason is that braces denote a tuple in Typescript, not an array.

The Docs