交互式示例

探索实时示例，了解该库在常见 Angular 用例中的表现。

编辑与剪贴板

可编辑的表格

Product	Units	Unit price	Total
M6 zinc-plated bolt	1200	0.12	144
M6 flat washer	3400	0.04	136
Self-locking nut	800	0.09	72
Threaded rod, 1 m	45	3.75	168.75

Click a cell and type, or press F2 to edit keeping the value. Enter commits and drops a row, Tab commits and moves right.

与 Excel 复制粘贴

Meter	January (kWh)	February (kWh)	Change
Warehouse	1240.5	1188	-52.5
Workshop	890.25	935.75	45.5
Offices	410	402.5	-7.5
Cold store	3120.8	3260.4	139.5999999999999

Select a range, copy it, and paste it into Excel. Or the other way round.

列类型，以及使用自定义编辑器

Task	Status	Due	Assignee
Site survey	Done	2026-10-02	Ana Ruiz
Cabling	In progress	2026-10-09	Luis Prat
Patch panel	Not started
Handover	On hold

A click picks a cell; a double click, F2 or simply typing opens it. Open Status for a list, Due for a date and Assignee for a searchable hub-select supplied by this page; Billable takes one click on its box. Hover an empty Due or Assignee cell to see its hint.

用别名写，也用坐标写的公式

Item	Units	Price	Discount	Total	VAT 21%
Steel bolt M6	400	0.12	0	48	10.08
Washer	1200	0.04	0.1	43.2	9.07
Hex nut	800	0.09	0	72	15.12
Anchor	60	1.4	0.25	63	13.23
Order total				226.2	47.5

Change a quantity and the totals follow. Open a Total cell to see the formula, and the last row to see a column added up.

自己画某一列的单元格：徽章与操作

Reference	Customer	State	Total	Actions
INV-0412	Ferretería Sur	Paid	1240.5	RemindArchive
INV-0413	Metalls Prat	Pending	890.25	RemindArchive
INV-0414	Suministros Mora	Late	410	RemindArchive
INV-0415	Bilbo Tools	Pending	3120.8	RemindArchive

Pick a row and use the actions at the end. Copy the State column into a spreadsheet: what travels is paid, not the badge.

把控件库接一次，而不是每列写一个模板

Subject	Queue	Severity
Card reader offline	Field service	High
Duplicate invoice	Billing	Normal
Password reset loop	Support	Critical
Old portal export	Legacy (closing)	Low

Queue and Severity have no editor of their own. Open one and it is the house select, with its search box.

表格形态

冻结的行与列

Region	Jan	Feb	Mar	Apr	May	Jun	Jul	Aug	Sep	Oct	Nov	Dec
Total	27608	28924	29391	28580	27236	26595	27246	28591	29392	28914	27595	26649
North	4000	5515	5637	4254	2638	2274	3497	5183	5781	4742	3021	2200
Levante	5637	4254	2638	2274	3497	5183	5781	4742	3021	2200	3034	4756
Centre	2638	2274	3497	5183	5781	4742	3021	2200	3034	4756	5783	5171
South	3497	5183	5781	4742	3021	2200	3034	4756	5783	5171	3482	2269
Islands	5781	4742	3021	2200	3034	4756	5783	5171	3482	2269	2648	4270
Portugal	3021	2200	3034	4756	5783	5171	3482	2269	2648	4270	5643	5506
France	3034	4756	5783	5171	3482	2269	2648	4270	5643	5506	3984	2477

Scroll sideways and down. The region column and the first row stay put, and the seam is drawn on the last frozen track.

合并的区块

Time	Monday	Tuesday	Wednesday
09:00	Standup	Standup	Quarterly review
10:00	Design workshop	Support rota
11:00	Design workshop	Support rota
12:00	Retro	Open	Open

The Monday workshop spans two hours, and Wednesday's review spans three. Arrow into one, then try selecting only part of it. Select a rectangle and right-click to put it together, or right-click a block to take it apart.

一万行乘五十列，文档里只放着一屏

Meter	Taken	kWh	Cost	00:00	00:30	01:00	01:30	02:00	02:30	03:00	03:30	04:00	04:30	05:00	05:30	06:00	06:30	07:00	07:30	08:00	08:30	09:00	09:30	10:00	10:30	11:00	11:30	12:00	12:30	13:00	13:30	14:00	14:30	15:00	15:30	16:00	16:30	17:00	17:30	18:00	18:30	19:00	19:30	20:00	20:30	21:00	21:30	22:00	22:30	23:00	23:30
Warehouse	2026-01-01	120	20	4	4.6	5.2	5.7	6.2	6.5	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1
Workshop	2026-01-01	132.5	19.98	4.6	5.2	5.7	6.2	6.5	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5
Offices	2026-01-01	144.9	19.9	5.2	5.7	6.2	6.5	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9
Cold store	2026-01-01	156.9	19.78	5.7	6.2	6.5	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4
Yard	2026-01-01	168.5	19.61	6.2	6.5	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9
Warehouse	2026-01-02	179.3	19.39	6.5	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5
Workshop	2026-01-02	189.4	19.13	6.8	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5	1.2
Offices	2026-01-02	198.5	18.83	7	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5	1.2	1.1
Cold store	2026-01-02	206.6	18.48	7	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5	1.2	1.1	1
Yard	2026-01-02	213.6	18.1	6.9	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5	1.2	1.1	1	1.1
Warehouse	2026-01-03	219.4	17.69	6.7	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5	1.2	1.1	1	1.1	1.2
Workshop	2026-01-03	224	17.24	6.4	6	5.5	5	4.4	3.8	3.2	2.7	2.2	1.7	1.4	1.1	1	1	1.1	1.3	1.7	2.1	2.6	3.2	3.8	4.3	4.9	5.5	6	6.4	6.7	6.9	7	7	6.8	6.6	6.2	5.8	5.2	4.7	4.1	3.5	2.9	2.4	1.9	1.5	1.2	1.1	1	1.1	1.2	1.5

10,000 rows and 52 columns. Scroll either way: the document holds a screenful at a time, and the first column stays put.

填充手柄，以及一步撤销整次拖拽

Undo

Redo

0 of 0 steps

Code	Task	Hours
INV-001	Site survey	8
INV-002	Cabling	16
	Patch panel
	Labelling
	Handover

Select the two codes, then drag the corner square down. Undo with Ctrl+Z.

调整列宽与重新排序

Reset the layout

Nothing resized yet

Name	Company	Email	City
Ana Ruiz	Ferretería Sur	ana@ferreteriasur.es	Sevilla
Luis Prat	Metalls Prat	luis@metallsprat.cat	Girona
Eva Mora	Suministros Mora	eva@sumora.es	Albacete
Jon Díaz	Bilbo Tools	jon@bilbotools.eus	Bilbao

Drag the right edge of a header to widen it, or drag the header itself to move the column.

状态与结构

每个单元格的保存状态

Tariff	Price	Margin
Standard	42	0.18
Volume	38.5	0.14
Partner	35	0.11
Launch	29	0.06

Written, not sent Saving Saved Failed Changed elsewhere

Edit a price. Anything ending in 9 fails on purpose, so you can see the error state.

增删行与列

Add a line

Add a column

Remove the last column

Task	Hours
Site survey
Cabling

Add a column, remove it, add another: the alias never comes back.

Aliases handed out so far

description · col-1

使用信号表单进行逐单元格校验

Product	Units	Unit price
M6 zinc-plated bolt	1200	0.12
M6 flat washer	3400	0.04
Self-locking nut	800	0.09

Submit

Clear a product name or set units to 0, then leave the cell.

导出到 Excel 或 CSV，再导回来

Import a file

Item	Units	Price	Total
Steel bolt M6	400	0.12	48
Washer	1200	0.04	48
Hex nut	800	0.09	72

Export it, open it in Excel, change a quantity, save it and bring it back.