Menu
Need to access to property children element. Parent:
<div> <shipment-detail #myCarousel ></shipment-detail> </div> @Component({ selector: "testProject", templateUrl: "app/partials/Main.html", directives: [ShipmentDetail] }) class AppComponent { getChildrenProperty() { // I want to get access to "shipment" } } Children:
@Component({ selector: "shipment-detail", }) export class ShipmentDetail { shipment: Shipment; } 
348
We can get child component values in the parent component by creating a reference to the child component using the @ref directive in the Parent component. Using the reference instance, you can access the child component values in the parent.
Sending data to a child componentlinkThe @Input() decorator in a child component or directive signifies that the property can receive its value from its parent component. To use @Input() , you must configure the parent and child.
To let Angular know that a property in a child component or directive can receive its value from its parent component we must use the @Input() decorator in the said child. The @Input() decorator allows data to be input into the child component from a parent component.
See the Component Interaction cookbook. So, use @ViewChild() and add a method to ShipmentDetail that the parent can call to retrieve the shipment value, or just access the property directly, as I show below (because I was lazy and didn't want to write an API/method):
@Component({ selector: "testProject", templateUrl: "app/partials/Main.html", directives: [ShipmentDetail] }) export class AppComponent { @ViewChild(ShipmentDetail) shipmentDetail:ShipmentDetail; ngAfterViewInit() { this.getChildProperty(); } getChildProperty() { console.log(this.shipmentDetail.shipment); } } Plunker
121
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
