Closed stephenmatthews closed 2 years ago
Hi, im new to angular and I cant seem to get my datatable working properly. Any help would be greatly appreciated!
This is what i'm currently getting - it just says No data available in table and i cant get the sorting or search to work either
component.html
<table datatable [dtOptions]="dtOptions" datatable="ng" class="row-border hover table table-striped table-bordered"> <thead> <tr> <th>Name</th> <th>Company</th> <th>Email</th> <th>Action</th> </tr> </thead> <tbody> <tr *ngFor="let client of clients"> <td>{{ client?.clientName }}</td> <td>{{ client?.clientCompany }}</td> <td>{{ client?.clientEmail }}</td> <td> <button class="solid">Edit</button> <button class="danger">Delete</button> </td> </tr> </tbody> </table>
component.ts
dtOptions: DataTables.Settings = {}; clients: any = []; dtTrigger: Subject<any> = new Subject<any>(); constructor( public webService: WebService, private renderer: Renderer2, private router: Router, private httpClient: HttpClient ) { } ngOnInit(): void { this.dtOptions = { pagingType: 'full_numbers', pageLength: 2 }; this.webService.getClients() .subscribe(data => { this.clients = data; console.log(this.clients) // Calling the DT trigger to manually render the table this.dtTrigger.next; }); } ngOnDestroy(): void { // Do not forget to unsubscribe the event this.dtTrigger.unsubscribe(); }
example data used
Hi, im new to angular and I cant seem to get my datatable working properly. Any help would be greatly appreciated!
This is what i'm currently getting - it just says No data available in table and i cant get the sorting or search to work either
component.html
component.ts
example data used