Having issues while attempting to iterate through a JavaScript dictionary within my HTML markup using *ngFor
with Object.entries
, and encountering an error message:
Error: Unexpected token [, expected identifier, keyword, or string at column 5 in [let [key, item] of Object.entries(items)]
Here is the template:
<button *ngFor="let [key, item] of Object.entries(items)"
(click)="itemClicked.emit([key, item.value])">
{{ item.displayName }}
</button>
And here is the TypeScript code:
export interface DropDownItem {
displayName: string,
value: any,
checked: boolean
}
@Component({ /* ... */ })
export class MyComponent {
@Input() items: { [key: string]: DropdownItem };
@Output() itemClicked = new EventEmitter<[string, any]>();
Object = Object;
constructor() { }
}