Question

我的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>

我的指示：

.directive('dataTable', function() {
        return {
            restrict: 'A',
            replace: false,
            transclude: true,
            link: function (scope, el, attrs) {
                console.info('dataTable', el);
                $(el).dataTable();
            }
        }
    })

我没有收到任何错误，但没有显示任何内容（我现在无法知道el是什么）。我希望在信息被转换的地方使用它，然后使用dataTable的“零配置”。我认为这很简单，唉，指令:(

Answer 1

你看过ng-grid了吗？它是一个提供分页/排序等的本机实现。

但是如果你必须使用DataTables，看看这个答案，我最近使用了这里的解决方案并且效果很好：https://stackoverflow.com/a/16096071/2383201

Answer 2

您不能使用data作为属性的前缀。将其更改为其他任何内容，例如myTable（用法：my-table）会让指令捡起来。

但是，现在似乎无法解析列，这意味着唯一的解决方案是@Skinty提供的the link

Answer 3

您还可以查看angular-datatables - Datables using angular directives项目。它有很多关于如何将角度指令与数据表一起使用的例子。

我知道这个问题现在有点老了，但我可能会帮助那些最终在这里寻找相同问题的人。

如何使用数据表创建基本的angularjs指令

3 个答案: