Angular Spreadsheet Component | ng-hub-ui-spreadsheet

Editable Angular spreadsheet with Excel's keyboard, rectangular selection, a clipboard that round-trips with Excel, frozen panes and merged cells. MIT, accessible, no paid tier.

Интерактивные примеры

Изучите живые примеры, показывающие, как библиотека ведёт себя в типичных сценариях использования Angular.

Редактирование и буфер обмена

Редактируемый лист

Product Units Unit price Total
M6 zinc-plated bolt12000.12144
M6 flat washer34000.04136
Self-locking nut8000.0972
Threaded rod, 1 m453.75168.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
Warehouse1240.51188-52.5
Workshop890.25935.7545.5
Offices410402.5-7.5
Cold store3120.83260.4139.5999999999999

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

Типы столбцов и собственный редактор

Task Status Due Billable Assignee
Site surveyDone2026-10-02Ana Ruiz
CablingIn progress2026-10-09Luis Prat
Patch panelNot started
HandoverOn 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 M64000.1204810.08
Washer12000.040.143.29.07
Hex nut8000.0907215.12
Anchor601.40.256313.23
Order total226.247.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-0412Ferretería SurPaid1240.5
RemindArchive
INV-0413Metalls PratPending890.25
RemindArchive
INV-0414Suministros MoraLate410
RemindArchive
INV-0415Bilbo ToolsPending3120.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 offlineField serviceHigh
Duplicate invoiceBillingNormal
Password reset loopSupportCritical
Old portal exportLegacy (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
Total276082892429391285802723626595272462859129392289142759526649
North400055155637425426382274349751835781474230212200
Levante563742542638227434975183578147423021220030344756
Centre263822743497518357814742302122003034475657835171
South349751835781474230212200303447565783517134822269
Islands578147423021220030344756578351713482226926484270
Portugal302122003034475657835171348222692648427056435506
France303447565783517134822269264842705643550639842477

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:00StandupStandupQuarterly review
10:00Design workshopSupport rota
11:00
12:00RetroOpenOpen

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
Warehouse2026-01-011202044.65.25.76.26.56.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.1
Workshop2026-01-01132.519.984.65.25.76.26.56.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.5
Offices2026-01-01144.919.95.25.76.26.56.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.9
Cold store2026-01-01156.919.785.76.26.56.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.4
Yard2026-01-01168.519.616.26.56.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.9
Warehouse2026-01-02179.319.396.56.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.5
Workshop2026-01-02189.419.136.8776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.51.2
Offices2026-01-02198.518.83776.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.51.21.1
Cold store2026-01-02206.618.4876.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.51.21.11
Yard2026-01-02213.618.16.96.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.51.21.111.1
Warehouse2026-01-03219.417.696.76.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.51.21.111.11.2
Workshop2026-01-0322417.246.465.554.43.83.22.72.21.71.41.1111.11.31.72.12.63.23.84.34.95.566.46.76.9776.86.66.25.85.24.74.13.52.92.41.91.51.21.111.11.21.5

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

Маркер заполнения и отмена перетаскивания одним шагом

UndoRedo0 of 0 steps
Code Task Hours
INV-001Site survey8
INV-002Cabling16
Patch panel
Labelling
Handover

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

Изменение ширины и порядка столбцов

Reset the layoutNothing resized yet
Name Company Email City
Ana RuizFerretería Surana@ferreteriasur.esSevilla
Luis PratMetalls Pratluis@metallsprat.catGirona
Eva MoraSuministros Moraeva@sumora.esAlbacete
Jon DíazBilbo Toolsjon@bilbotools.eusBilbao

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

Состояние и структура

Состояние сохранения ячейки

Tariff Price Margin
Standard420.18
Volume38.50.14
Partner350.11
Launch290.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 lineAdd 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 fardescription · col-1

Проверка по ячейкам с сигнальными формами

Product Units Unit price
M6 zinc-plated bolt12000.12
M6 flat washer34000.04
Self-locking nut8000.09
Submit Clear a product name or set units to 0, then leave the cell.

Выгрузка в Excel или CSV — и обратно

Item Units Price Total
Steel bolt M64000.1248
Washer12000.0448
Hex nut8000.0972

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