Angular2与JQuery数据表

在Angular2使用数据表

我需要在Angular2组件的数据表中显示数据。 为此，我安装datatables.net和datatables.net.bs我以前的问题是Angular2与Datatables 。 我正在使用angular2-routing进行导航。 在上一个问题中甚至在路由上也会发生此错误。

目前使用路由时没有错误。 它完美地运作。 但是当浏览器重新加载时我有2个错误

  1. 无法重新初始化数据表
  2. 未捕获的TypeError：无法读取未定义的属性’aDataSort’

我的更新code是 

  ngOnInit() { this._userService.getUsers() .then( userDetailsListVOs => {this.userDetailsListVOs = userDetailsListVOs, this.viewUserDetails()},error => this.errorMessage = error); } viewUserDetails(){ if (this.tableWidget) { this.tableWidget.destroy(); } this.tableOptions = { data: this.userDetailsListVOs, columns: [ { title: 'ULA ID', data: 'ulaId',className: 'all'}, { title: 'City', data: 'city',className: 'none',sorting: false }, { title: 'Actions',data: 'data',className: 'all',sorting: false, render: function ( row,type,data,meta) { var edit = " Edit " var view = " [routerLink]=['/view-profile',"+data.ulaId+"]" return `
 
`; }} ], rowCallback: (row: Node, data: any | Object, index: number) => { $('.actionView', row).unbind('click'); $('.actionView', row).bind('click', (e) => { e.preventDefault(); e.stopPropagation(); this.router.navigate(['/view-profile', data.ulaId]); }); $('.actionEdit', row).unbind('click'); $('.actionEdit', row).bind('click', (e) => { e.preventDefault(); e.stopPropagation(); this.router.navigate(['/edit-profile', data.ulaId]); }); return row; } } this.shipmentsTable = $(this._elRef.nativeElement.querySelector('table')); this.tableWidget = this.shipmentsTable.DataTable(this.tableOptions); this.tableWidget.on('select', (e, dt, type, indexes) => { this.userDetailsListVOs1.emit(this.userDetailsListVOs[indexes[0]]); }); }

我的Html代码是

我有2个错误

重振错误

和

adatasort错误 Pl。帮我解决

Interesting Posts