(Angular Web App) Как использовать объект с 2 строковыми свойствами в качестве параметра для фильтрации данных - PullRequest
0 голосов
/ 28 июня 2019

Angular 7. В настоящее время я отображаю данные на экране, который показывает 4 категории финансовых инструментов, поэтому в основном это сетка с 4 строками.Таблица 2: содержит 100 строк данных, которые могут попадать в любую из этих 4 категорий.Я пытаюсь написать некоторый код, который после того, как пользователь щелкает одну из строк категорий (таблица 1), получает все данные из таблицы 2, которые имеют одинаковые id и name как категория строки

Таблица 1:

  **id**       **name**    
      1        ab
      2        bc
      3        cd
      4        de

Таблица 2:

**id**       **name** 
  1        ab
  1        ab
  1        cd
  3        de        
  4        bc
  3        cd
  2        de

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

Я создал Интерфейс, содержащий значения, которые я хочу отфильтровать по:

export interface NodeServiceQuery {
    id: string;
    name: string;
}

Затем в компонент маршрута я добавил эту логику, которая, я считаю, является правильной.

  ngOnInit(): void {
    }

    onItemSelected(item: ResourceResponseItem<NodeInfo>) {
        const relativeNavigation = this._relativeNavigationBase();

        if (item) {

            relativeNavigation.push(item.payload.id);
            const name= item.payload.name;
            const id= item.payload.id;

            const matching: NodeServiceQuery = {
                name,
                id,
            };

            this.nodeServiceQuery.next(matching);
        }

        this._router.navigate(relativeNavigation, {relativeTo: this._activatedRoute});

    }
}

А в компоненте, который должен выполнять фильтрацию, я пытался использовать карту из ngrx для фильтрации данных и возврата соответствующих данных.

  ngOnInit() {
        this.resource$ = this._resourceService.resourceDetail(this._resourceUrn);

        this.query$ = this.nodeServiceQuery$.pipe(
            map((nodeServiceQuery: NodeServiceQuery) => {
                if (!nodeServiceQuery) {
                    return {};
                }
                return {
                    nodeServiceQuery
                };

ОШИБКА TypeError: Невозможно прочитать свойство 'pipe' из undefined в NodeInfoListComponent.push ../ src / app / node-info-lib / src / lib / components / node-info-list / node-info-list.component.ts.NodeInfoListComponent.ngOnInit

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

Желаемый результат, если выбрана первая строка таблицы 1

Таблица:

id       name    
 1        ab
 1        ab

К сожалению, я не могу предоставить пример данных, и я действительно надеюсь, что разъяснил вопрос.новый тоже это.Заранее спасибо !!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...