Классы источника данных / хранилища данных родовой угловой таблицы материалов - PullRequest
Новая
       21

Классы источника данных / хранилища данных родовой угловой таблицы материалов

0 голосов
/ 14 декабря 2018

Я заметил, что пишу довольно много повторяющегося кода, связанного с настройкой разбитых на страницы сервера, отфильтрованных и доступных для поиска таблиц материала.

Повторяющийся код в основном относится к обычным классам таблицы требуемых материалов: * источник данных.ts * datastore.ts

Моя идея состояла в том, чтобы обобщить эти классы для приема служб http, реализующих определенный интерфейс, в котором был бы определен один метод, вызывающий API для отфильтрованного результата и возвращающий что-то вродеТип Observable, где T будет некоторой сущностью.

Проблема в том, что я, кажется, не знаю, как этого достичь.Я пробовал несколько вещей, но в итоге столкнулся с проблемами, связанными с типами.

Вот что у меня есть:

Интерфейс службы http: 

export interface ITableFilterService {

    getFilteredData<T>(tableFilter: TableFilter): Observable<T>;
}

httpсам сервис (проблема: Observable не может быть назначен Observable): 

export class EventListMockService implements ITableFilterService {

    /* tslint:disable:member-access */
    getFilteredData<T>(tableFilter: TableFilter): Observable<T> {
        return this.getFilteredListOfItems(tableFilter);
    }

    public getFilteredListOfItems(filter: TableFilter): Observable<EventItem[]> {

        return this.getListOfItems();
    }

очень проблемный datastore.service.ts (нужно каким-то образом сделать сущность EventItem) универсальным и все, что с ним связанов этом классе: 

export class EventDataStoreService {

    private copiedData: EventItem[];
    public dataChange: BehaviorSubject<EventItem[]> = new BehaviorSubject<EventItem[]>([]);
    public unitCount = 0;

    get data(): EventItem[] {
        return this.dataChange.value;
    }

    constructor(private service: EventListMockService,
                tableFilter: TableFilter) {
        this.copiedData = this.data.slice();
        this.getUnitList(tableFilter);
    }

    public getUnitList(tableFilter: TableFilter): void {
        this.service.getFilteredListOfItems(tableFilter).subscribe((response) => {
            this.copiedData = response;
            this.unitCount = response.length;
            this.dataChange.next(this.copiedData);
        });
    }
}

, а также очень проблематичный datasource.service.ts (требуется общий сервис и сущность): 

export class EventDataSourceService extends DataSource<{}> {

    public paginator: MatPaginator;
    public sort: MatSort;
    private filterChange = new BehaviorSubject('');

    get filter(): string {
        return this.filterChange.value;
    }

    set filter(filter: string) {
        this.filterChange.next(filter);
    }

    constructor(private dataStore: EventDataStoreService) {
        super();
    }

    public connect(): Observable<EventItem[]> {
        const displayDataChanges = [
            this.dataStore.dataChange,
            this.paginator.page,
            this.filterChange,
            this.sort.sortChange,
        ];

        return merge(...displayDataChanges).pipe(map(() => {
            const data = this.getSortedData();

            return data.splice(0, this.paginator.pageSize)
                .filter((item: EventItem) => {
                    let searchString = '';
                    Object.keys(item).forEach((key) => {
                        searchString += key ? key.toLowerCase() : '';
                    });

                    return searchString.toLowerCase().indexOf(this.filter.toLowerCase()) !== -1;
                });
        }));
    }

    public disconnect(): void {
        this.filterChange.complete();
    }

    public getSortedData(): EventItem[] {
        return this.dataStore.data.slice();
    }
}

Возможно, кто-то делал что-то подобное в прошлома можете поделиться решением?Это было бы здорово.Да, и дело в том, что использование any запрещено :( Спасибо!

...