Thank you, Nihira! I was even able to manage it in Angular 18 (with a few modifications).
@NihiraTechiees
14 күн бұрын
Great 👍
@22MuraliKrishna
5 ай бұрын
Thank you soo much, this is very use full
@NihiraTechiees
5 ай бұрын
You are welcome 👍
@ReinaldoRoldan-v5q
2 күн бұрын
Thank you, but unfortunately your code in the repo is completely different to the example you are showing in the video. How can I get the source code to have it as reference?
@VijayKumar-fq4ie
5 ай бұрын
good one. very useful
@NihiraTechiees
5 ай бұрын
Thanks brother👍
@nightsurvivor
3 ай бұрын
hi sir, nice tutorial. How to create custom search box for each column ?
@NihiraTechiees
3 ай бұрын
Yes will make separate video soon
@Sagar_Kumar456
5 ай бұрын
What if I have 10000 data and I don't want to load all data at a time, on clicking the next , want to request chunks of data each time from server
@NihiraTechiees
5 ай бұрын
Then we have to go with server side rendering.... Will upload separate video soon
@akadeadahot7067
5 ай бұрын
U have to fetch data in chunk from backend , where u can search for sql query for that , it includes limit and skip and offset
@swatisharma8039
3 ай бұрын
what if we want to make this table as reuable component so that we can use this in anywhere in application? we just need to pass the data in that compoent and should refresh on data change
@NihiraTechiees
3 ай бұрын
Make reusable components have signal variable for store data ... whenever value changed in signal it will reflect in ui
@simplifiedlearning000
3 ай бұрын
When I delete any data and making an API to call to fetch the updated data, it still shows the same data on UI. Thoguh my API has given me the updated data. What changes I need to do to re-render my tab;e?
@NihiraTechiees
3 ай бұрын
Look like your delete function have some issue please verify
@viniciusfazolo5150
3 ай бұрын
I have the same problem
@NihiraTechiees
3 ай бұрын
Could you confirm your delete api working in postman? I suspect your delete not working correctly
@simplifiedlearning000
3 ай бұрын
@@NihiraTechiees Api is deleting the data, but updated data is not reflecting on UI Basically I want to re-render the table with updated data which is not hppening
@viniciusfazolo5150
3 ай бұрын
@@simplifiedlearning000 I managed to fix this bug by deleting a record, creating the rerender function, which deletes the DataTable instance. also it is important to use the NgonDestroy function: private rerender(): void { this.dtElement.dtInstance.then((dtInstance: Api) => { dtInstance.destroy(); this.dtTrigger.next(null); }); } ----------------------------- my source code: import { AfterViewChecked, AfterViewInit, Component, OnDestroy, OnInit, ViewChild } from '@angular/core'; import { DefaultLayoutPagesComponent } from '../../../components/default-layout-pages/default-layout-pages.component'; import { Category, CategoryService } from '../../../services/category.service'; import { CommonModule } from '@angular/common'; import { ToastrService } from 'ngx-toastr'; import { RouterLinkWithHref } from '@angular/router'; import { DataTableDirective, DataTablesModule } from 'angular-datatables'; import { Api, Config } from 'datatables.net'; import { Subject } from 'rxjs'; @Component({ selector: 'app-list-category', standalone: true, imports: [ DefaultLayoutPagesComponent, CommonModule, RouterLinkWithHref, DataTablesModule, ], templateUrl: './list-category.component.html', styleUrl: './list-category.component.css', }) export class ListCategoryComponent implements OnInit, OnDestroy { categories: Category[] = []; idItem: string = ''; dtOptions: Config = {}; dtTrigger: Subject = new Subject(); @ViewChild(DataTableDirective, { static: false }) dtElement!: DataTableDirective; constructor( private categoryService: CategoryService, private toastr: ToastrService ) {} ngOnInit(): void { this.createDataTable(); this.getCategories(); } ngOnDestroy(): void { this.dtTrigger.unsubscribe(); } getCategories() { this.categoryService.getAll().subscribe((categories) => { this.categories = categories; if (this.dtElement.dtInstance == undefined) { this.dtTrigger.next(null); }else{ this.rerender() } }); } saveItem(idItem: string) { this.idItem = idItem; } deleteItem() { this.categoryService.delete(this.idItem).subscribe( () => { this.toastr.success('Registro excluído com sucesso!'); this.getCategories(); }, () => { this.toastr.error('Erro ao excluir registro!'); } ); } private createDataTable() { this.dtOptions = { pagingType: 'full_numbers', autoWidth: false, language: { url: 'assets/plugins/datatables/json/dataTables.ptbr.json', }, columnDefs: [ { orderable: false, target: -1, }, ], lengthMenu: [5, 10, 25, 50, 100], }; } private rerender(): void { this.dtElement.dtInstance.then((dtInstance: Api) => { dtInstance.destroy(); this.dtTrigger.next(null); }); } }
@kiranpatel5003
4 ай бұрын
Pagination is not working for me. i am getting data from sever and my backend is PHP. This video is usefull but pagination not working in my case only first page comes.
@NihiraTechiees
4 ай бұрын
Can you check any error in console
@aksharanatureworld
5 ай бұрын
❤
@NihiraTechiees
5 ай бұрын
Thanks
@muhamadhasanaliabdurohmanm6803
4 ай бұрын
I got problem in dtOptions: Config={}
@NihiraTechiees
4 ай бұрын
What is the problem?
@kabirmalik8794
Ай бұрын
how to remove single row from table
@NihiraTechiees
Ай бұрын
By using key value we can remove. Will cover in future video
Пікірлер: 33