AG Grid मधील ओळींची गटवारी, ॲग्रिगेशन, ट्री डेटा, master/detail आणि Excel एक्सपोर्ट Enterprise मध्ये येतात: प्रोडक्शनमध्ये वापरण्यासाठी व्यावसायिक लायसन्स लागते, आणि की नसल्यास ग्रिड वॉटरमार्क दाखवते आणि कन्सोलमध्ये त्रुटी नोंदवते. Needless UI डेटा ग्रिडमध्ये एकूण बेरजांसह गटवारी, ट्री डेटा, ओळींचा तपशील आणि .xlsx एक्सपोर्ट MIT लायसन्सअंतर्गत मिळतात. हे मार्गदर्शक Angular ॲप एकाकडून दुसऱ्याकडे नेते: काय जसेच्या तसे चालते, काय चालत नाही, आणि कोड कसा बदलतो.
यात AG Grid 36 मधील नावे वापरली आहेत. AG Grid 36 हे Angular 20 ते 22 ला सपोर्ट करते; Needless UI ला Angular 22 लागते.
आपल्याला काय मिळते
| फीचर | AG Grid | Needless UI |
|---|---|---|
| ॲग्रिगेट्स आणि एकूण ओळीसह ओळींची गटवारी | Enterprise | होय: अनेक स्तरांवर, बेरीज, सरासरी, किमान, कमाल, संख्या किंवा एखाद्या फंक्शनसह |
| ट्री डेटा | Enterprise | होय, नेस्टेड ओळींमधून |
| ओळीखाली तपशील (master/detail) | Enterprise | होय: ओळीखाली कोणताही टेम्पलेट, अगदी दुसरे ग्रिडसुद्धा |
| Excel एक्सपोर्ट | Enterprise: स्टाइल्स, अनेक शीट्स, चित्रे आणि सूत्रे | होय: प्रकार जपणाऱ्या सेलची एक शीट, संख्यांच्या फॉरमॅटसह आणि फिल्टर्स असलेल्या फ्रीझ केलेल्या हेडरसह |
| कॉलम निवडण्याच्या सोयीसह कॉलम मेनू | Enterprise | होय: प्रत्येक कॉलम सॉर्ट, फिल्टर, पिन आणि फिट करणे, हलवणे व लपवणे, आणि सर्व कॉलम एकदम दाखवणे किंवा लपवणे |
| अनेक कॉलमनुसार सॉर्टिंग, जलद शोध, पेजिंग, ओळींची निवड | Community | होय |
| कॉलम फिल्टर्स | Community: AND किंवा OR ने जोडलेल्या जास्तीत जास्त दोन अटी | प्रत्येक कॉलमसाठी एक अट |
| सेट, मल्टी आणि ॲडव्हान्स्ड फिल्टर्स | Enterprise | अंशतः: कॉलमच्या पर्यायांची चेकबॉक्स यादी, डेटामधील व्हॅल्यूंची नाही |
| कॉलमची रुंदी बदलणे, कॉलम हलवणे, पिन करणे व लपवणे, आणि त्यांची स्थिती सेव्ह करणे | Community | होय |
| व्हर्च्युअल स्क्रोलिंग | Community: ओळी आणि कॉलम | ओळी |
| सेल एडिटिंग | Community; काही एडिटर Enterprise मध्ये | होय, कॉलमच्या प्रकारानुसार, व्हॅलिडेशनसह; कस्टम एडिटर नाहीत आणि अनडू नाही |
| पिव्होटिंग, अंगभूत चार्ट्स | Enterprise | नाही |
| क्लिपबोर्ड, सेल रेंज निवड, कॉन्टेक्स्ट मेनू, स्टेटस बार, साइड बार | Enterprise | नाही |
| सर्व्हरवरील डेटा | सर्व्हर-साइड रो मॉडेल: Enterprise; ब्लॉकमध्ये लोडिंग: Community | आपल्या सर्व्हरकडून येणारी पेजेस, त्याच्याच सॉर्ट, फिल्टर्स आणि शोधासह; सर्व्हरवर गटवारी नाही |
| कॉलम गट, ओळी ड्रॅग करणे, पिन केलेल्या ओळी | Community | नाही |
| फ्रेमवर्क | React, Angular 20 ते 22, Vue आणि साधे JavaScript | Angular 22 आणि React 19 |
काय कशाशी जुळते
| AG Grid | Needless UI ग्रिड |
|---|---|
<ag-grid-angular>, मॉड्यूल नोंदणी, LicenseManager.setLicenseKey() | <nui-grid>; काहीही नोंदवायचे नाही आणि की नाही |
rowData, columnDefs | [(rows)], [columns] |
field, headerName | id, header |
valueGetter, valueFormatter, cellDataType | value, format (Intl पर्याय किंवा फंक्शन), type |
cellRenderer | nuiGridCell टेम्पलेट |
pinned: 'left', hide | pinned: 'start', hidden |
कॉलमचे rowGroup, groupDefaultExpanded | [(groupBy)], कॉलम id ची यादी. गट सुरुवातीला उघडे असतात; [(collapsed)] त्यांना बंद करते. |
aggFunc, grandTotalRow | aggregate, totals |
treeData आणि treeDataChildrenField | children: (row) => row.children |
masterDetail, detailCellRenderer | nuiGridDetail टेम्पलेट, आणि [(details)] |
quickFilterText | [(search)] |
rowSelection, getSelectedRows() | selection, आणि [(selected)]: निवडलेल्या ओळींच्या की |
pagination, paginationPageSize | [(pageSize)], [(page)], pageSizes |
getColumnState(), applyColumnState() | [(columnState)] |
exportDataAsExcel(), exportDataAsCsv() | exportXlsx() Blob परत करते, आणि exportCsv() मजकूर |
cellValueChanged, rowDoubleClicked | (cellEdit), (rowActivate) |
rowModelType: 'serverSide' | mode="server", total, (queryChange) |
localeText, enableRtl | labels; उजवीकडून डावीकडची दिशा पेजच्या dir नुसार ठरते |
देशानुसार गटबद्ध ऑर्डर्स, दोन्ही प्रकारे
काम असे: देशानुसार गटबद्ध ऑर्डर्स, प्रत्येक देशाची एकूण बेरीज आणि सगळ्यांची मिळून एक एकूण बेरीज, Excel एक्सपोर्ट, जलद शोध आणि अनेक ओळींची निवड. AG Grid 36 सह, जिथे गटवारी, एकूण बेरजा आणि Excel एक्सपोर्टसाठी Enterprise लागते:
Needless UI ग्रिडसह:
काही गोष्टी वेगळ्या प्रकारे चालतात. निवडीत की असतात, म्हणजे ओळींचे id, त्यामुळे नवीन डेटा आला तरी निवड टिकून राहते; ओळी हव्या असतील तेव्हा या की वापरून त्या शोधा. गट सुरुवातीला उघडे असतात. गटाचे लेबल पहिल्या दिसणाऱ्या कॉलममध्ये असते, आणि शोध फक्त दिसणारे कॉलमच वाचतो, त्यामुळे गटवारीच्या कॉलममधील व्हॅल्यूही शोधात जुळायला हव्या असतील तर तो कॉलम दिसता ठेवा. आणि exportXlsx() फाइल डाउनलोड करण्याऐवजी ती परत करते: फिल्टर व सॉर्ट केलेल्या ओळींची एक शीट, गट ओळींशिवाय.
जे नाही ते हवे असल्यास
आपले ॲप पिव्होटिंग, चार्ट्स, क्लिपबोर्ड आणि रेंज निवड, सर्व्हरवरील गटवारी किंवा कॉलम गटांवर अवलंबून असल्यास, Needless UI ग्रिड अजून AG Grid ची जागा घेऊ शकत नाही. आपल्याला जे हवे आहे त्यासाठी इश्यू उघडा. इतर सर्व गोष्टींसाठी डेटा ग्रिडच्या पेजवर प्रत्येक इनपुट, आउटपुट आणि उदाहरण आहे.