Skip to content

Commit

Permalink
fix(material/table): data source filteredData not updating while disc…
Browse files Browse the repository at this point in the history
…onnected (#22058)

The data source was changed in #21338 so that it unsubscribes while it's disconnected. The
problem is that the subscription has a side effect which updates `filteredData` as well.

These changes add some logic so that `filteredData` is updated even if the source is
disconnected.

Fixes #21984.

(cherry picked from commit 0093105)
  • Loading branch information
crisbeto authored and annieyw committed Mar 9, 2021
1 parent 4c69d18 commit afdec6f
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 2 deletions.
10 changes: 10 additions & 0 deletions src/material/table/table-data-source.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,16 @@ describe('MatTableDataSource', () => {
dataSource.connect();
expect(spy).toHaveBeenCalledTimes(1);
});

it('should update filteredData even if the data source is disconnected', () => {
dataSource.data = [1, 2, 3, 4, 5];
expect(dataSource.filteredData).toEqual([1, 2, 3, 4, 5]);

dataSource.disconnect();
dataSource.data = [5, 4, 3, 2, 1];
expect(dataSource.filteredData).toEqual([5, 4, 3, 2, 1]);
});

});
});

Expand Down
18 changes: 16 additions & 2 deletions src/material/table/table-data-source.ts
Original file line number Diff line number Diff line change
Expand Up @@ -65,14 +65,28 @@ export class _MatTableDataSource<T, P extends Paginator> extends DataSource<T> {

/** Array of data that should be rendered by the table, where each object represents one row. */
get data() { return this._data.value; }
set data(data: T[]) { this._data.next(data); }
set data(data: T[]) {
this._data.next(data);
// Normally the `filteredData` is updated by the re-render
// subscription, but that won't happen if it's inactive.
if (!this._renderChangesSubscription) {
this._filterData(data);
}
}

/**
* Filter term that should be used to filter out objects from the data array. To override how
* data objects match to this filter string, provide a custom function for filterPredicate.
*/
get filter(): string { return this._filter.value; }
set filter(filter: string) { this._filter.next(filter); }
set filter(filter: string) {
this._filter.next(filter);
// Normally the `filteredData` is updated by the re-render
// subscription, but that won't happen if it's inactive.
if (!this._renderChangesSubscription) {
this._filterData(this.data);
}
}

/**
* Instance of the MatSort directive used by the table to control its sorting. Sort changes
Expand Down

0 comments on commit afdec6f

Please sign in to comment.