angular 2 Access child component object from parent component class

Question

Need to access to property children element.

Parent:

<div>
   <shipment-detail #myCarousel ></shipment-detail>
</div>

@Component({
  selector: "testProject",
  templateUrl: "app/partials/Main.html")
class AppComponent { 
  getChildrenProperty() {
  // I want to get access to "shipment" 
  }
}

Children:

@Component({
      selector: "shipment-detail",
    }) 
    export class ShipmentDetail  {
      shipment: Shipment;
    }

Exact duplicate of angular 2 access child component property from parent component — LarsMonty
– LarsMonty, Commented Aug 18, 2017 at 18:53
The answer over there does not work anymore as angular is updated and i tried to ask it with a commen which didnt help.. — crystal_test
– crystal_test, Commented Aug 18, 2017 at 20:04

Stanislav Kvitash · Accepted Answer · 2017-08-18 23:49:48Z

4

The @ViewChild and @ViewChildren decorators provide access to the class of child component:

@Component({
    selector: "testProject",
    templateUrl: "app/partials/Main.html")
class AppComponent {

    @ViewChild(ShipmentDetail) ShipDetails: ShipmentDetail;

    getChildrenProperty() {
        console.log(this.ShipDetails.shipment);
    }
}

@ViewChild requires the name of child component class as its input and finds its selector in the parent component.

In your case it should be ShipmentDetail.

edited Aug 18, 2017 at 23:49

Stanislav Kvitash

4,63221 silver badges29 bronze badges

answered Aug 18, 2017 at 17:39

RIYAJ KHAN

15.3k5 gold badges34 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

angular 2 Access child component object from parent component class

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related