My html:
<table data-table ng-show="bookings">
<thead>
<tr>
<th>Name</th>
<th>Surname</th>
<th>ID number</th>
<th>Email</th>
<th>Cellphone</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="booking in bookings | orderBy:['student.firstname', 'student.surname']">
<td>{{ booking.student.firstname }}</td>
<td>{{ booking.student.surname }}</td>
<td>{{ booking.student.id_number }}</td>
<td>{{ booking.student.email }}</td>
<td>{{ booking.student.cellphone }}</td>
</tr>
</tbody>
</table>
My directive:
.directive('dataTable', function() {
return {
restrict: 'A',
replace: false,
transclude: true,
link: function (scope, el, attrs) {
console.info('dataTable', el);
$(el).dataTable();
}
}
})
I don't get any error, but nothing is displayed (I cannot now know what the el is). I wish to use it where the info is transcluded, and then the 'zero configuration' of dataTable are used. I thought this would be simple, alas, directives :(
