如何在Angular4中获取数据进入控制台进入HTML

Question

I have data in ts, i need to fetch that data inside the Angular4 html, but i am able to fetch only 2 data which are outside the loop. Can anyone help me to fetch data inside angular4.

HTML:

              <tr *ngFor="let accept of accepts">
                <td>{{accept.name}}</td>
                <td>{{accept.description}}</td>
                <td>{{accept.daterecv}}</td>
                <td>{{accept.dateacc}}</td>
                <td>{{accept.deadline}}</td>
                <td>{{accept.price}}</td>
                <td>{{accept.status}}</td>
                <td>{{accept.due_date}}</td>
              </tr>
            </tbody>

Ts:

this.service
            .getProfileData(id)
            .subscribe(
              data => {
                this.accepts = data;
                console.log(this.accepts);
              }, error => {})

Consoled Output:

Answer 1

Some of the fields rendered are wrong,make sure the keys are present in the data in the ts also use safe navigation operator to make sure data is present, it should be as

<tr *ngFor="let accept of accepts">
            <td>{{accept?.Job?.User?.name}}</td>
            <td>{{accept?.user?.description}}</td>
            <td>{{accept?.Job?.price}}</td>
            <td>{{accept?.Job?.status}}</td>
            <td>{{accept?.Job?.due_date}}</td>
</tr>

Answer 2

This might help

 <tr *ngFor="let accept of accepts">
            <td>{{accept?.Job?.User?.name}}</td>
            <td>{{accept?.Job?.description}}</td>
            <td>{{accept?.Job?.deadline}}</td>
            <td>{{accept?.Job?.price}}</td>
            <td>{{accept?.Job?.status}}</td>
            <td>{{accept?.Job?.due_date}}</td>
          </tr>