Menu
I don't really understand how object binding works, so if anyone could explain if I can use @Input() inside a base class, or better: decorators and inheritance. For example if each form should receive a customer I have a base class:
export class AbstractCustomerForm{
@Input() customer;
...
}
and then I extend this class in an actual component:
export AwesomeCustomerForm extends AbstractCustomerForm implements OnInit{
ngOnInit(){
if(this.customer)
doSomething();
}
}
but this won't work, customer will never get set :(
967
@Input() and @Output() give a child component a way to communicate with its parent component. @Input() lets a parent component update data in the child component. Conversely, @Output() lets the child send data to a parent component.
Use the @Input() decorator in a child component or directive to let Angular know that a property in that component can receive its value from its parent component. It helps to remember that the data flow is from the perspective of the child component.
@Input is used to define an input property, to achieve component property binding. @Inoput decorator is used to pass data (property binding) from parent to child component. The component property should be annotated with @Input decorator to act as input property. Let's explore it practically.
Decorators are a new feature of Typescript and used throughout the Angular 2 code, but they are nothing to be scared of. With decorators we can configure and customise our classes at design time. They are just functions that can be used to add meta-data, properties or functions to the thing they are attached to.
update
Inheritance is properly supported since 2.3.0-rc.0
original
Decorators are not inherited. They need to be applied to the class used as component directly. Decorators on subclasses are ignored. I have seen it mentioned that @Input() or @Output() are working if only the super class has them and the sub-class has none.
125
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
