Myko
Myko

Reputation: 59

Parser Error Unexpected token when trying to submit an @Input value

In my angular app I have a component with a template like this:

 <div>
    <app-component2 [input1]="value"></app-component2>
 </div>

and an @Input input1 in the typescript-part.

When building/running the app, I get a Parser Error saying: Unexpected token 'value' at column... I thought that this is the way to submit the input1 value to the component2. What do I do wrong?

Upvotes: 0

Views: 1157

Answers (2)

Myko
Myko

Reputation: 59

I think I found the problem:

My submitted value was a string, but angular tried to find it as a property of the parent component. I submitted it with [input1]='"value"' and the parsing error disappeared.

Upvotes: 1

G&#233;r&#244;me Grignon
G&#233;r&#244;me Grignon

Reputation: 4238

The left-hand part of the data binding is the name of the child property, the right-hand part being a value or the name of the parent property.

@Input() sould be defined inside your child component. In your case we should expect input1 to be the name of the @Input and value the name of the property from the parent component.

Parent component :

value: any;

Parent template :

 <div>
    <app-component2 [input1]="value"></app-component2>
 </div>

Child component :

@Input() input1: any;

Upvotes: 0

Related Questions