Basic use of `<table mat-table>`
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Styling columns using their auto-generated column names
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Adding and removing data when using an array-based datasource.
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Table dynamically changing the columns displayed
name | weight | symbol | position |
---|---|---|---|
Hydrogen | 1.0079 | H | 1 |
Helium | 4.0026 | He | 2 |
Lithium | 6.941 | Li | 3 |
Beryllium | 9.0122 | Be | 4 |
Boron | 10.811 | B | 5 |
Carbon | 12.0107 | C | 6 |
Nitrogen | 14.0067 | N | 7 |
Oxygen | 15.9994 | O | 8 |
Fluorine | 18.9984 | F | 9 |
Neon | 20.1797 | Ne | 10 |
Adding and removing data when using an observable-based datasource.
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Table with expandable rows
name | weight | symbol | position | |
---|---|---|---|---|
Hydrogen | 1.0079 | H | 1 | |
1 H Hydrogen 1.0079 Hydrogen is a chemical element with symbol H and atomic number 1. With a standard
atomic weight of 1.008, hydrogen is the lightest element on the periodic table. -- Wikipedia | ||||
Helium | 4.0026 | He | 2 | |
2 He Helium 4.0026 Helium is a chemical element with symbol He and atomic number 2. It is a
colorless, odorless, tasteless, non-toxic, inert, monatomic gas, the first in the noble gas
group in the periodic table. Its boiling point is the lowest among all the elements. -- Wikipedia | ||||
Lithium | 6.941 | Li | 3 | |
3 Li Lithium 6.941 Lithium is a chemical element with symbol Li and atomic number 3. It is a soft,
silvery-white alkali metal. Under standard conditions, it is the lightest metal and the
lightest solid element. -- Wikipedia | ||||
Beryllium | 9.0122 | Be | 4 | |
4 Be Beryllium 9.0122 Beryllium is a chemical element with symbol Be and atomic number 4. It is a
relatively rare element in the universe, usually occurring as a product of the spallation of
larger atomic nuclei that have collided with cosmic rays. -- Wikipedia | ||||
Boron | 10.811 | B | 5 | |
5 B Boron 10.811 Boron is a chemical element with symbol B and atomic number 5. Produced entirely
by cosmic ray spallation and supernovae and not by stellar nucleosynthesis, it is a
low-abundance element in the Solar system and in the Earth's crust. -- Wikipedia | ||||
Carbon | 12.0107 | C | 6 | |
6 C Carbon 12.0107 Carbon is a chemical element with symbol C and atomic number 6. It is nonmetallic
and tetravalent—making four electrons available to form covalent chemical bonds. It belongs
to group 14 of the periodic table. -- Wikipedia | ||||
Nitrogen | 14.0067 | N | 7 | |
7 N Nitrogen 14.0067 Nitrogen is a chemical element with symbol N and atomic number 7. It was first
discovered and isolated by Scottish physician Daniel Rutherford in 1772. -- Wikipedia | ||||
Oxygen | 15.9994 | O | 8 | |
8 O Oxygen 15.9994 Oxygen is a chemical element with symbol O and atomic number 8. It is a member of
the chalcogen group on the periodic table, a highly reactive nonmetal, and an oxidizing
agent that readily forms oxides with most elements as well as with other compounds. -- Wikipedia | ||||
Fluorine | 18.9984 | F | 9 | |
9 F Fluorine 18.9984 Fluorine is a chemical element with symbol F and atomic number 9. It is the
lightest halogen and exists as a highly toxic pale yellow diatomic gas at standard
conditions. -- Wikipedia | ||||
Neon | 20.1797 | Ne | 10 | |
10 Ne Neon 20.1797 Neon is a chemical element with symbol Ne and atomic number 10. It is a noble gas.
Neon is a colorless, odorless, inert monatomic gas under standard conditions, with about
two-thirds the density of air. -- Wikipedia |
Table with filtering
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Basic use of `<mat-table>` (uses display flex)
Flex table where one column's cells has a greater height than others.
Footer row table
Item | Cost |
---|---|
Beach ball | $4.00 |
Towel | $5.00 |
Frisbee | $2.00 |
Sunscreen | $4.00 |
Cooler | $25.00 |
Swim suit | $15.00 |
Total | $55.00 |
Table with columns defined using a for loop instead of statically written in the template.
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Testing with MatTableHarness
This example contains tests. Open in Stackblitz to run the tests.
Table retrieving data through HTTP
Created | State | # | Title |
---|---|---|---|
Feb 5, 2025 | open | 30448 | docs-bug(button): Change icon button size missing |
Feb 4, 2025 | open | 30447 | bug(MatAutoComplete): requiredSelection value racecon on panel close |
Feb 4, 2025 | open | 30446 | fix(material/core): remove animations from ng add |
Feb 4, 2025 | open | 30445 | bug(MatTree): expandAll() only expand the first level |
Feb 4, 2025 | open | 30444 | bug(Theming): When creating a theme using `mat.theme(` there is no way to configure typography like how we have with `mat.define-theme` |
Feb 3, 2025 | closed | 30443 | build: fix failing test |
Feb 3, 2025 | open | 30442 | docs-bug(MatFormFieldControl): Update "Creating a Custom Form Field Control" for Signals |
Feb 3, 2025 | closed | 30441 | refactor(material/schematics): drop standalone flag from schematics |
Feb 3, 2025 | open | 30440 | perf(material/tooltip): Defer injection of injectables not needed unt… |
Feb 3, 2025 | open | 30439 | bug(cdkDrag): Items in DropLIst Jump Down When Using DragBoundary or ConstrainPosition with Custom Preview |
Feb 3, 2025 | closed | 30438 | fix(material/datepicker): set aria-expanded on datepicker toggle |
Feb 2, 2025 | closed | 30437 | docs(material-angular-io): fix clearing filter doesnt reset type filter |
Feb 2, 2025 | open | 30436 | feat(cdk/drag-drop): introduce `resetToBoundary` |
Feb 2, 2025 | closed | 30435 | Remove animations dependency from the public API |
Feb 2, 2025 | open | 30434 | fix(material/radio): required attribute being set on buttons |
Feb 1, 2025 | closed | 30433 | docs: update links for Shadow DOM & Constructable Stylesheets |
Feb 1, 2025 | closed | 30432 | docs: add commit input validation in vscode settings |
Feb 1, 2025 | open | 30431 | fix(cdk/tree): retainining previous objects |
Jan 31, 2025 | open | 30430 | fix(material/chips): creates default aria-labelledby or placeholder for chips input |
Jan 31, 2025 | open | 30429 | fix(material/chips): forced colors disabled chip fix |
Jan 31, 2025 | closed | 30428 | perf(material/button): Optimize the remaining descendant state selector. |
Jan 31, 2025 | closed | 30427 | fix(material/sidenav): end positioned sidenav not opening in RTL |
Jan 31, 2025 | open | 30426 | bug(cdk/overlay): repeatedly opening and closing the overlay via (backdropClick) breaks responsiveness to clicks |
Jan 31, 2025 | open | 30425 | docs-bug(button): I don't understand how to use most of design tokens |
Jan 31, 2025 | closed | 30424 | Updated selectors in CSS snippet as per HTML snippet |
Jan 30, 2025 | closed | 30423 | Bump version to "v19.2.0-next.2" with changelog. |
Jan 30, 2025 | closed | 30422 | bug(mat-drawer): mat-drawer position="end" is broken in RTL since v19.0.5 |
Jan 30, 2025 | open | 30421 | feat(Timepicker): Implement a MAT_TIMEPICKER_SCROLL_STRATEGY for the component |
Jan 30, 2025 | open | 30420 | bug(map-advanced-marker): mapMouseover and mapMouseout events not working on map-advanced-marker |
Jan 30, 2025 | open | 30419 | docs(dialog-harness): fix typo |
Items per page:
30
1 – 30 of 30253
Table with multiple header and footer rows
Item | Cost |
---|---|
Name of the item purchased | Cost of the item in USD |
Beach ball | $4.00 |
Towel | $5.00 |
Frisbee | $2.00 |
Sunscreen | $4.00 |
Cooler | $25.00 |
Swim suit | $15.00 |
Total | $55.00 |
Please note that the cost of items displayed are completely and totally made up. |
Table with multiple row template
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
Secondary row for the element Hydrogen | |||
2 | Helium | 4.0026 | He |
Secondary row for the element Helium | |||
3 | Lithium | 6.941 | Li |
Secondary row for the element Lithium | |||
4 | Beryllium | 9.0122 | Be |
Secondary row for the element Beryllium | |||
5 | Boron | 10.811 | B |
Secondary row for the element Boron | |||
6 | Carbon | 12.0107 | C |
Secondary row for the element Carbon | |||
7 | Nitrogen | 14.0067 | N |
Secondary row for the element Nitrogen | |||
8 | Oxygen | 15.9994 | O |
Secondary row for the element Oxygen | |||
9 | Fluorine | 18.9984 | F |
Secondary row for the element Fluorine | |||
10 | Neon | 20.1797 | Ne |
Secondary row for the element Neon | |||
11 | Sodium | 22.9897 | Na |
Secondary row for the element Sodium | |||
12 | Magnesium | 24.305 | Mg |
Secondary row for the element Magnesium | |||
13 | Aluminum | 26.9815 | Al |
Secondary row for the element Aluminum | |||
14 | Silicon | 28.0855 | Si |
Secondary row for the element Silicon | |||
15 | Phosphorus | 30.9738 | P |
Secondary row for the element Phosphorus | |||
16 | Sulfur | 32.065 | S |
Secondary row for the element Sulfur | |||
17 | Chlorine | 35.453 | Cl |
Secondary row for the element Chlorine | |||
18 | Argon | 39.948 | Ar |
Secondary row for the element Argon | |||
19 | Potassium | 39.0983 | K |
Secondary row for the element Potassium | |||
20 | Calcium | 40.078 | Ca |
Secondary row for the element Calcium |
Data table with sorting, pagination, and filtering.
ID | Name | Progress | Fruit |
---|---|---|---|
1 | Violet A. | 51% | pomegranate |
2 | Amelia I. | 84% | lime |
3 | Cora A. | 88% | kiwi |
4 | Jack J. | 84% | pineapple |
5 | Jack J. | 66% | pomegranate |
Items per page:
5
1 – 5 of 100
Table with pagination
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
Items per page:
5
1 – 5 of 20
Table that uses the recycle view repeater strategy.
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Table with re-orderable columns
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Binding event handlers and properties to the table rows.
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Click Log
Clicked rows will be logged here
Table showing each row context properties.
$implicit | index | count | first | last | even | odd |
---|---|---|---|---|---|---|
one | 0 | 5 | true | false | true | false |
two | 1 | 5 | false | false | false | true |
three | 2 | 5 | false | false | true | false |
four | 3 | 5 | false | false | false | true |
five | 4 | 5 | false | true | true | false |
Table with selection
No. | Name | Weight | Symbol | |
---|---|---|---|---|
1 | Hydrogen | 1.0079 | H | |
2 | Helium | 4.0026 | He | |
3 | Lithium | 6.941 | Li | |
4 | Beryllium | 9.0122 | Be | |
5 | Boron | 10.811 | B | |
6 | Carbon | 12.0107 | C | |
7 | Nitrogen | 14.0067 | N | |
8 | Oxygen | 15.9994 | O | |
9 | Fluorine | 18.9984 | F | |
10 | Neon | 20.1797 | Ne |
Table with sorting
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Table with sticky columns
Name | No. | Weight | Symbol | No. | Weight | Symbol | |
---|---|---|---|---|---|---|---|
Hydrogen | 1 | 1.0079 | H | 1 | 1.0079 | H | |
Helium | 2 | 4.0026 | He | 2 | 4.0026 | He | |
Lithium | 3 | 6.941 | Li | 3 | 6.941 | Li | |
Beryllium | 4 | 9.0122 | Be | 4 | 9.0122 | Be | |
Boron | 5 | 10.811 | B | 5 | 10.811 | B | |
Carbon | 6 | 12.0107 | C | 6 | 12.0107 | C | |
Nitrogen | 7 | 14.0067 | N | 7 | 14.0067 | N | |
Oxygen | 8 | 15.9994 | O | 8 | 15.9994 | O | |
Fluorine | 9 | 18.9984 | F | 9 | 18.9984 | F | |
Neon | 10 | 20.1797 | Ne | 10 | 20.1797 | Ne |
Flex-layout tables with toggle-able sticky headers, footers, and columns
Sticky Headers:
Sticky Footers:
Sticky Columns:
Tables with toggle-able sticky headers, footers, and columns
Sticky Headers:
Sticky Footers:
Sticky Columns:
Position | Name | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Weight | Symbol |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Position | Name | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Filler header cell | Weight | Symbol |
1 | Hydrogen | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 1.0079 | H |
2 | Helium | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 4.0026 | He |
3 | Lithium | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 6.941 | Li |
4 | Beryllium | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 9.0122 | Be |
5 | Boron | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 10.811 | B |
6 | Carbon | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 12.0107 | C |
7 | Nitrogen | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 14.0067 | N |
8 | Oxygen | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 15.9994 | O |
9 | Fluorine | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 18.9984 | F |
10 | Neon | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | Filler data cell | 20.1797 | Ne |
Position Footer | Name Footer | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Weight Footer | Symbol Footer |
Position Footer | Name Footer | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Filler footer cell | Weight Footer | Symbol Footer |
Table with a sticky footer
Item | Cost |
---|---|
Beach ball | $4.00 |
Towel | $5.00 |
Frisbee | $2.00 |
Sunscreen | $4.00 |
Cooler | $25.00 |
Swim suit | $15.00 |
Total | $55.00 |
Table with sticky header
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Use of 'mat-text-column' with various configurations of the interface.
Position | Element | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.01 | H |
2 | Helium | 4 | He |
3 | Lithium | 6.94 | Li |
4 | Beryllium | 9.01 | Be |
5 | Boron | 10.81 | B |
6 | Carbon | 12.01 | C |
7 | Nitrogen | 14.01 | N |
8 | Oxygen | 16 | O |
9 | Fluorine | 19 | F |
10 | Neon | 20.18 | Ne |
Use of `mat-text-column` which can be used for simple columns that only need to display
a text value for the header and cells.
Position | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |
Tables with Material Design ripples.
Table example that shows how to wrap a table component for definition and behavior reuse.
No. | Name | Weight | Symbol |
---|---|---|---|
1 | Hydrogen | 1.0079 | H |
2 | Helium | 4.0026 | He |
3 | Lithium | 6.941 | Li |
4 | Beryllium | 9.0122 | Be |
5 | Boron | 10.811 | B |
6 | Carbon | 12.0107 | C |
7 | Nitrogen | 14.0067 | N |
8 | Oxygen | 15.9994 | O |
9 | Fluorine | 18.9984 | F |
10 | Neon | 20.1797 | Ne |