Angular 2: Access object data

Question

In my Angular RC2 app I make an observable HTTP call that returns the following JSON to me from the API:

{
    "success":true,
    "data":
    {
        "Type": 1
        "Details":{
            "Id":"123",
            "Name":"test",
            "Description":"test"
        }
    }
}

I map the data like this:

this._myService.get(id)
    .subscribe(
        (data) => {
            this.details = data.Details;
            this.type = data.Type;
        },
        (error) => {
            this.setError(error);
        }
     );

How do I access the values inside the "Details" object from here?

I tried:

{{details.Name}}

But that won't work and I can't use ngFor to loop it either.

Thierry Templier · Accepted Answer · 2016-06-29 07:50:26Z

8

You could use the Elvis operator for this:

{{details?.Name}}

As a matter of fact, you load your data asynchronously so details is undefined at the beginning.

answered Jun 29, 2016 at 7:50

Thierry Templier

203k44 gold badges407 silver badges366 bronze badges

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

2 Comments

Yuna Over a year ago

You could also use *ngIf="details" or *ngIf="details.Name" (so you could show something like "loading" for *ngIf="!details")

Thierry Templier Over a year ago

@bene yes agreed! It depends on the use case ;-)

Collectives™ on Stack Overflow

Angular 2: Access object data

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related