CODEWITHSUNDEEP
typescriptangular
plone1
plone1

Reputation: 676

Angular2: JsonObject as @Input value

Angular2: 2.0.0-beta8

I would like to customize a Directive. In order to achieve that I created an Object that contains all my custom parameters and I hoped to pass it on my template like this :

My directive used in a template:

<div my-directive="{param1: 46, param2: 48}"></div>

Input in my Directive:

@Input('my-directive')
public conf: Configuration;

Param Object definition:

export interface Configuration{param1;param2; ...}

Sadly, it doesn't work. Maybe cause of a Json parse ?

Upvotes: 4

Views: 4100

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657731

If you want to assign an object use the [propName]="value" syntax

[my-directive]="{param1: 46, param2: 48}"

This is standard attribute binding where Angular isn't involved. 

<div my-directive="{param1: 46, param2: 48}"></div>

Attributes can only hold strings. @Input() reads the value from the attribute after it was stringifyied.

Hint: For input- , output-, and directive names myDirective is preferred over my-directive. Only element names use my-element for custom elements compatibility.

Upvotes: 6

Related Questions