I noticed it's possible to property bind stuff without brackets. What is the difference?
Typescript:
import { Component, Input } from '@angular/core';
@Component( {
selector: 'my-comp',
templateUrl: `
input is {{foo}}
`
})
export class myComponent {
@Input() public foo: string;
constructor() { }
}
HTML:
Case 1
<my-comp [foo]="bar"></my-comp>
Case 2
<my-comp foo="bar"></my-comp>
There are some Cases where we need to add like this html attributes dynamically might be and example which comes json from api request
Case 1 [] known as Property Binding
<my-comp [foo]="data.bar"></my-comp>
Case 2 {{ }} known as Interpolation
<my-comp foo="{{data.bar}}"></my-comp>
Case 3 Conditional handling
<my-comp [attr.foo]="data.bar ? true : false"></my-comp>
Both {{ }} called as Interpolation and [] called as Property Binding means angular understand that there is One-way from data source to view target.
For more visit www.codementor.io