Angular: Pass object to directive

Question

I'm looking for a way to pass an object into a directive, but it turns up as a string.

Given this template:

<div my-directive="{ name: 'Roger', orders: ['apple', 'pie'] }"></div>

How can I get an object back in the directive?

@Input('my-directive') initialData: any; //initial data is a string

I assume maybe something with JSON.parse, but not sure how?

Answer 1

You have to use binding [] syntax

<div [my-directive]="{ name: 'Roger', orders: ['apple', 'pie'] }"></div>

otherwise it is treated a string, and you want object here.