Angular 7: destructuring with Typescript interface, getting errors

Question

I have an interface like so:

And a component like so:

But I am getting this error:

How can I destructure my values so that Typescript will be happy?

What do you mean *"destructure my values"* - are you expecting only to assign the first element, for example? Also `AccountList` seems like an odd name for something that isn't a list. — jonrsharpe, Jan 04 '19 at 16:36
Questions on Stack Overflow cannot depend on screenshots of code. Your code has to go in your question as text. — user229044, Jan 04 '19 at 16:51

score 3 · Accepted Answer · edited Jan 04 '19 at 16:35

3

In your local declarations, can you try :

@Input() accounts: Accounts;
myAccountsList: Array<AccountList>;
authorizedAccountsList: Array<AccountList>;

edited Jan 04 '19 at 16:35

jonrsharpe

115,751
26
228
437

answered Jan 04 '19 at 16:31

dun32

708
6
9

score 0 · Answer 2 · edited Jan 04 '19 at 16:49

I think is because you are declaring the variables of myAccountsList and authorizedAccountsList as AccountList type, but in the interface you defined as Array<AccountList>. Depending of which of the types is the correct one, you need to change:

If the type is AccountList, change on the interface:

export interface Accounts {
    authorizedAccountsList: AccountList;
    myAccountsList: AccountList;
}

If the type is Array<AccountList>, change on the declaration of the variables:

@Input() accounts: Accounts;
myAccountsList: Array<AccountList>;
authorizedAccountsList: Array<AccountList>;

Angular 7: destructuring with Typescript interface, getting errors

2 Answers2