CODEWITHSUNDEEP
javascriptangularangular7
Atul kumar singh
Atul kumar singh

Reputation: 329

How to parse json in angular 7?

I have the following output from my node rest api :

{
    "workorder": [
        {
            "id": 1,
            "Workorderno": 110,
            "Nfno": 23,
            "Amount": 230,
            "Orderno": 34,
            "createdAt": "2019-03-02 00:19:49.495 +00:00",
            "updatedAt": "2019-03-02 12:40:36.647 +00:00"
        }
    ]
}

I want to read the output and display it in a table using angular 7 ? Could anyone guide me through as to do that? I tried making changes in my rest API, but it failed I could get the results

Upvotes: 0

Views: 5079

Answers (2)

jone
jone

Reputation: 1

Try add to tr tag: ngIf="data.workorder!=null"

Upvotes: 0

Sajeetharan
Sajeetharan

Reputation: 222532

You need something like this using ngFor,

<table class="table table-striped">
        <thead>
            <tr>
                <th>Id</th>
                <th>Workorder No</th>
            </tr>
        </thead>
        <tbody>
           <tr *ngFor="let work of data.workorder">
            <td>{{work?.id}}</td>
            <td>{{work?.Workorderno}}</a></td>
           </tr>
        </tbody>
    </table>
</div>

and your Interface should be like this,

  export interface Workorder {
        id: number;
        Workorderno: number;
        Nfno: number;
        Amount: number;
        Orderno: number;
        createdAt: string;
        updatedAt: string;
    }

and then in your component,

  data : Workorder;
  constructor(private service: nowService) {

  }

  ngOnInit() {
    this.service.getAll().subscribe((data) => {
       this.data = data;
    })
  }
}

Upvotes: 1

Related Questions