I'm confused on how would i able to read the project.name inside of these arrays and object? I want to display the project.name, building project.description. small...? How can iterate it in the html table row? Here's what i've done below. Hope you guys can help
{
"token": "eyJ": [
{
"id": 1,
"organization_id": 1,
"created_at": "2017-10-24 05:06:37",
"updated_at": "2017-10-24 07:38:24",
"organization": {
"id": 1,
"name": "Malayss",
"logo": "default.png",
"created_at": "2017-10-24 10:54:51",
"updated_at": "2017-10-24 10:54:51",
"projects": [
{
"id": 1,
"name": "House",
"description": "Small",
"organization_id": 1,
"created_at": "2017-10-24 02:41:50",
"updated_at": "2017-10-24 02:41:50",
"material_projects": [
{
"id": 1,
"material_id": 1,
"project_id": 1,
"quantity": 10,
"unit": "pcs",
"purchased": 0,
"balance": 10,
"created_at": "2017-10-24 02:42:14",
"updated_at": "2017-10-24 02:42:14",
"material": {
"id": 1,
"sku": "1320484",
"name": "Cement",
"created_at": "2017-10-24 02:41:22",
"updated_at": "2017-10-24 02:41:22"
}
}
],
"project_services": [
{
"service_id": 1,
"project_id": 1,
"unit": "square feet",
"created_at": "2017-10-24 02:42:14",
"updated_at": "2017-10-24 02:42:14",
"service": {
"id": 1,
"sku": "734676",
"name": "Cleaning",
"created_at": "2017-10-24 02:41:36",
"updated_at": "2017-10-24 02:41:36"
}
}
]
}
]
}
}
]
}
html
<tr *ngFor="let project of projects.organization">
<td *ngFor="let inner of projects">{{ inner.name }}</td>
</tr>
Your iteration should look like this:
<table>
<ng-container *ngFor="let project of projects.projects">
<tr>
<th>Name</th>
<th>Description</th>
</tr>
<tr *ngFor="let inner of project.organization.projects">
<td>{{inner.name}}</td>
<td>{{inner.description}}
</tr>
</ng-container>
</table>