Skip to content

Commit 47ecf53

Browse files
s4m0r4m4mmalerba
authored andcommitted
docs(material/table): additional details on table data sources (#21921)
Provides additional documentation and clarification on extending the base DataSource class with custom data sources either by extending or implementing. Fixes #21887 * docs(material/table) removing backticks around "extending" (cherry picked from commit 5c57c86)
1 parent 0bfbc9c commit 47ecf53

File tree

1 file changed

+14
-5
lines changed

1 file changed

+14
-5
lines changed

src/material/table/table.md

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -107,13 +107,22 @@ automatically trigger an update to the rows each time a new data array is emitte
107107
#### DataSource
108108

109109
For most real-world applications, providing the table a DataSource instance will be the best way to
110-
manage data. The DataSource is meant to serve a place to encapsulate any sorting, filtering,
110+
manage data. The DataSource is meant to serve as a place to encapsulate any sorting, filtering,
111111
pagination, and data retrieval logic specific to the application.
112112

113-
A DataSource is simply a base class that has two functions: `connect` and `disconnect`. The
114-
`connect` function will be called by the table to receive a stream that emits the data array that
115-
should be rendered. The table will call `disconnect` when the table is destroyed, which may be the
116-
right time to clean up any subscriptions that may have been registered during the connect process.
113+
A DataSource is simply a class that has at a minimum the following methods: `connect` and
114+
`disconnect`. The `connect` method will be called by the table to provide an Observable that emits
115+
the data array that should be rendered. The table will call `disconnect` when the table is destroyed,
116+
which may be the right time to clean up any subscriptions that may have been registered in the
117+
`connect` method.
118+
119+
Although Angular Material provides a ready-made table DataSource class, `MatTableDataSource`, you may
120+
want to create your own custom DataSource class for more complex use cases. This can be done by
121+
extending the abstract DataSource class with a custom DataSource class that then implements the
122+
`connect` and `disconnect` methods. For use cases where the custom DataSource must also inherit
123+
functionality by extending a different base class, the DataSource base class can be
124+
implemented instead (`MyCustomDataSource extends SomeOtherBaseClass implements DataSource`) to
125+
respect Typescript's restriction to only implement one base class.
117126

118127
### Features
119128

0 commit comments

Comments
 (0)