在Angular 2 Component中访问JQuery Datatable

Question

我从API获取数据并使用Angular 2渲染它。

getData() {
        this.http.get('api/Employee').subscribe(result => {
            var localdata = result.json();
            for (var i = 0; i < localdata.length; i++)
                this.employeeList.push(localdata[i]);
            console.log(this.employeeList);   
            $('#example').DataTable();
        })
    }

获得数据后，我必须使用

将普通表转换为Jquery Datatable

$('#example').DataTable();

但我面临以下问题显示：表中没有数据以及数据。

Answer 1

我建议您使用angular-datatables

如果不是这种情况，您可以使用数组源，如指示here

$('#example').DataTable( {data: this.EmployeeList });

如果您已经创建了一个

，请记住销毁任何现有的数据表

Answer 2

最后通过导入AfterViewInit

解决了这个问题

export class EmployeeComponent implements AfterViewInit {   

    ngAfterViewInit() {
            setTimeout(() => {
                $('#example').DataTable();
            }, 1000);

        }
}