How can I define an interface for an array of objects with Typescript

Question

I have the following interface and code  I thought I was doing the definitions correctly but I am getting an error   interface IenumServiceGetOrderBy   id  number  label  string  key  any        and   getOrderBy    entity   IenumServiceGetOrderBy   gt            var result  IenumServiceGetOrderBy          switch  entity                case  content                   result                                           id  0  label   CId   key   contentId                           id  1  label   Modified By   key   modifiedBy                           id  2  label   Modified Date   key   modified                           id  3  label   Status   key   contentStatusId                           id  4  label   Status  gt  Type   key    contentStatusId    contentTypeId                            id  5  label   Title   key   title                           id  6  label   Type   key   contentTypeId                           id  7  label   Type  gt  Status   key    contentTypeId    contentStatusId                                        break                    return result           Error   Error   190 Cannot convert        to  IenumServiceGetOrderBy       Type        is missing property  id  from type  IenumServiceGetOrderBy

User · Answer

You can define an interface as array with simply extending the Array interface.

export interface MyInterface extends Array<MyType> { }

With this, any object which implements the MyInterface will need to implement all function calls of arrays and only will be able to store objects with the MyType type.

User · Answer

Also you can do this               interface IenumServiceGetOrderBy                   id  number                   label  string                   key  any                                notice i am not using the                var oneResult  IenumServiceGetOrderBy     id  0  label   CId   key   contentId                   notice i am using                   it is read like  array of IenumServiceGetOrderBy              var ArrayOfResult  IenumServiceGetOrderBy                                      id  0  label   CId   key   contentId                       id  1  label   Modified By   key   modifiedBy                       id  2  label   Modified Date   key   modified                       id  3  label   Status   key   contentStatusId                       id  4  label   Status  gt  Type   key    contentStatusId    contentTypeId                        id  5  label   Title   key   title                       id  6  label   Type   key   contentTypeId                       id  7  label   Type  gt  Status   key    contentTypeId    contentStatusId

User · Answer

Easy option with no tslint errors      export interface MyItem       id  number     name  string    export type MyItemList    MyItem

User · Answer

Additional easy option       interface simpleInt           id  number          label  string          key  any             type simpleType   simpleInt

User · Answer

Use like this  interface Iinput     label  string   placeholder  string   register  any   type   string   required  boolean        This is how it can be done  const inputs  Array lt Iinput gt              label   quot Title quot       placeholder   quot Bought something quot       register  register      required  true

User · Answer

Do not use   interface EnumServiceGetOrderBy        index  number     id  number  label  string  key  any        You will get errors for all the Arrays properties and methods such as splice etc   The solution is to create an interface that defines an array of another interface  which will define the object   For example    interface TopCategoriesProps     data  Array lt Type gt     interface Type     category  string    percentage  number

User · Answer

Here s an inline version if you don t want to create a whole new type   export interface ISomeInterface extends Array lt        someindex  string   number    gt

User · Answer

In Angular use  extends  to define the interface for an  Array  of objects   Using an indexer will give you an error as its not an Array interface so doesn t contain the properties and methods   e g      error TS2339  Property  find  does not exist on type  ISelectOptions2        good     export interface ISelectOptions1 extends Array lt ISelectOption gt         bad export interface ISelectOptions2        index  number   ISelectOption     interface ISelectOption       prop1  string      prop2   boolean

User · Answer

You can define an interface with an indexer  interface EnumServiceGetOrderBy        index  number     id  number  label  string  key  any

User · Answer

Programming is simple  Use simple usecase   interface IenumServiceGetOrderBy   id  number  label  string  key  any       OR interface IenumServiceGetOrderBy   id  number  label  string  key  string   string         use interface like const result  IenumServiceGetOrderBy                                              id  0  label   CId   key   contentId                           id  1  label   Modified By   key   modifiedBy                           id  4  label   Status  gt  Type   key    contentStatusId    contentTypeId

User · Answer

Here is one solution adapted to your example  interface IenumServiceGetOrderByAttributes      id  number     label  string     key  any     interface IenumServiceGetOrderBy extends Array lt IenumServiceGetOrderByAttributes gt         let result  IenumServiceGetOrderBy   With this solution you can use all properties and methods of the Array  like  length  push    pop    splice

User · Answer

You don t need to use an indexer  since it a bit less typesafe   You have two options     interface EnumServiceItem       id  number  label  string  key  any    interface EnumServiceItems extends Array lt EnumServiceItem gt         Option A  var result  EnumServiceItem             id  0  label   CId   key   contentId           id  1  label   Modified By   key   modifiedBy           id  2  label   Modified Date   key   modified           id  3  label   Status   key   contentStatusId           id  4  label   Status  gt  Type   key    contentStatusId    contentTypeId            id  5  label   Title   key   title           id  6  label   Type   key   contentTypeId           id  7  label   Type  gt  Status   key    contentTypeId    contentStatusId            Option B var result  EnumServiceItems           id  0  label   CId   key   contentId           id  1  label   Modified By   key   modifiedBy           id  2  label   Modified Date   key   modified           id  3  label   Status   key   contentStatusId           id  4  label   Status  gt  Type   key    contentStatusId    contentTypeId            id  5  label   Title   key   title           id  6  label   Type   key   contentTypeId           id  7  label   Type  gt  Status   key    contentTypeId    contentStatusId         Personally I recommend Option A  simpler migration when you are using classes not interfaces

[typescript] How can I define an interface for an array of objects with Typescript?

Examples related to typescript