When creating Angular 2.0 components, how can default values be assigned to properties?
For instance - I wish to initialize foo
with 'bar'
, but it may get changed to 'baz'
immediately through binding. How does this process unfold in the lifecycle hooks?
@Component({
selector: 'foo-component'
})
export class FooComponent {
@Input()
foo: string = 'bar';
@Input()
zalgo: string;
ngOnChanges(changes){
console.log(this.foo);
console.log(changes.foo ? changes.foo.previousValue : undefined);
console.log(changes.foo ? changes.foo.currentValue : undefined);
}
}
Based on the provided templates, here is what I anticipate the values will look like. Is my assumption correct?
<foo-component [foo] = 'baz'></foo-component>
Console output:
'baz'
'bar'
'baz'
<foo-component [zalgo] = 'released'></foo-component>
Console output:
'bar'
undefined
undefined