I'm trying to show a table with ngTable in angularjs. This is my example
controller.js
var tableData = []
//Table configuration
$scope.tableParams = new NgTableParams({
page: 1,
count: 6
},{
total:tableData.length,
//Returns the data for rendering
getData : function(params){
$http.get('data.json').then(function(response) {
tableData = response.data.person;
tableData.slice((params.page() - 1) * params.count(), params.page() * params.count());
params.total(tableData.length);
});
}
});
vista.html
<table ng-table="tableParams" class="table table-bordered" >
<thead>
<tr>
<th rowspan="2">ID</th>
<th colspan="2">primary</th>
<th colspan="2">secondary</th>
</tr>
<tr>
<th>NAME</th>
<th>AGE</th>
<th>NAME</th>
<th>AGE</th>
</tr>
<thead>
<tbody>
<tr ng-repeat="person in $data"> //QUE ES DATA?
<td data-title="'id'" >
{{person.id}}
</td>
<td data-title="'Name'">
{{person.primary.name}}
</td>
<td data-title="'Age'">
{{person.primary.age}}
</td>
<td data-title="'Name'">
{{person.secondary.name}}
</td>
<td data-title="'Age'">
{{person.secondary.age}}
</td>
</tr>
</tbody>
</tbody>
</table>
json
{
"person":[
{
"id" : 1,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 2,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 3,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 4,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 5,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 6,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 7,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 8,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 1,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 2,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 3,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 4,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 5,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 6,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 7,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 8,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 1,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 2,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 3,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 4,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 5,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 6,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 7,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 8,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 1,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 2,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 3,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 4,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
},
{
"id" : 5,
"primary" : {"name":"John", "age":"20"},
"secondary" : {"name":"LINDA", "age":"23"}
},
{
"id" : 6,
"primary" : {"name":"SMITH", "age":"20"},
"secondary" : {"name":"KATE", "age":"25"}
},
{
"id" : 7,
"primary" : {"name":"Sandeep", "age":"20"},
"secondary" : {"name":"Sumanta", "age":"21"}
},
{
"id" : 8,
"primary" : {"name":"Bapi", "age":"20"},
"secondary" : {"name":"Tapi", "age":"25"}
}
]
}
the truth is the first time I use ngTable and I do not use it because it uses $ data my error I believe this variable because it does not show anything my table. How can i solve this? I thank you in advance