Can anyone help me in fetching JSON nested array in table content in angular?

Question

How should I use *ngfor and table display following data? I tried but get confused.

  <tr *ngFor='let properties.property_detail of properties, let i=index'>
              <td>{{properties.property_detail.name}}</td>

for observable and

return this.httpClient.post('http://localhost:8000/properties',
        {   "name":properties.property_detail.getName(),


{

  "properties":
  [
    {
      "property_details":
      {
        "name":"xyz",
        "email":"[email protected]",
        "mobile":1234567890,
        "id":2
      },
      "property_info":{
        "geo_lat":45.3556,
        "geo_long":13.6576756,
        "property_depth":200,
        "property_rating":4,
        "property_status":sold
      },
        "property_owner":{
          "name":"alex",
          "mobile":8765434568
          },
          "_id":"ftf5yfgty",
          "__v":0
          }
       ]
}

You should start by reading/watching some form of tutorial. Have you tried the tour of heroes in the angular docs? — Jota.Toledo
– Jota.Toledo, Commented Feb 6, 2019 at 19:11

Iftifar Taz · Accepted Answer · 2019-02-07 04:39:23Z

1

How ngFor works in angular:

    *ngFor='let <element> of <array>; let i=index'

then inside the loop you can access element properties like <element>.name

I agree with @Jota.Toledo. you should try the angular tour of heroes.

And solution to your problem:

    <tr *ngFor='let property of response.properties; let i=index'>
        <td>{{property.property_details.name}}</td>
    </tr>

edited Feb 7, 2019 at 4:39

answered Feb 6, 2019 at 19:14

Iftifar Taz

8398 silver badges14 bronze badges

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

1 Comment

SiKing Over a year ago

In order to improve the quality of your answer, please add some commentary about what this code does and how it solves the original question.

Collectives™ on Stack Overflow

Can anyone help me in fetching JSON nested array in table content in angular?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related