CODEWITHSUNDEEP
angular
kalamar
kalamar

Reputation: 953

Bind @Input() field in components template

I have a component like this:

@Component({
  selector: 'foo',
  template: '<h1>{{bar}}</h1>'
})
export class FooComponent {
  @Input()
  bar: string;
}

Now I'd like to use this component somewhere else (assuming everything is correctly configured):

<foo [bar]="Test"></foo>

The output is:

<h1></h1>

Do you know why? Why can't a @Input() field be bound in it's components template?

Version: Angular 2.0 Final Release

Upvotes: 3

Views: 1767

Answers (1)

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

Reputation: 657048

It should be 

<foo [bar]="'Test'"></foo>

or

<foo bar="Test"></foo>

otherwise the value of property Test of the parent component will be assigned, which is probably undefined.

Upvotes: 6

Related Questions