Angular2 avec JQuery Datatables

Utiliser des données dans Angular2

J’ai besoin d’afficher les données dans la table de données en composant Angular2. Pour cela, j’installe datatables.net et datatables.net.bs. Ma question précédente est Angular2 avec Datatables . J’utilise le angular2-routing pour la navigation. Dans cette question précédente, même sur le routage, cette erreur se produit également.

Actuellement, lors de l’utilisation du routage, il n’y a pas d’erreur. Ça fonctionne parfaitement. Mais j’ai 2 erreurs quand le navigateur se recharge

1. Impossible de réinitialiser datatable
2. Uncaught TypeError: Impossible de lire la propriété ‘aDataSort’ de undefined

Mon code mis à jour est

• Créer une nouvelle ligne dans la table de données bootstrap
• Conception de colonne de configuration de jQuery datatable et valeur dans le rappel de succès
• Comment jQuery DataTables peut-il être appliqué à une vue partielle avec rendu AJAX dans MVC4?
• Comment puis-je éviter les doublons sur un DataTable jQuery lors d’une navigation retour en présence de Turbolinks?
• JQuery Datatable – Fractionner une seule cellule en plusieurs colonnes pour une meilleure lisibilité?

  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 `
Tools 
 Edit 
 
 View 
 
`; }} ], 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]]); }); } 

Mon code HTML est

J’ai 2 erreurs

et

Aidez-moi à résoudre

• Extraire la valeur de la colonne Datatables ayant la propriété «bVisible: false»
• Comment faire un filtrage personnalisé dans Datatables avec des valeurs séparées par des virgules?
• Exportation jQuery DataTables CSV utf-8
• Échappe un signe ‘+’ dans une chaîne à utiliser dans une expression régulière dans coffeescript / javascript
• Comment append plusieurs lignes à un jQuery DataTable à partir d’une chaîne HTML