Показать значок направления стрелки после ручной настройки сортировки материалов - Angular Проект - PullRequest
0 голосов
/ 19 марта 2020

Я работаю в проекте Angular 9.

У меня есть компонент, который отображает таблицу данных элементов. Я использую таблицу данных материала для этого. Столбцы можно фильтровать и сортировать (используя сортировку материалов).

Я также сохраняю запрос на фильтрацию и сортировку в параметре маршрута, и я подписываюсь на это в ngOnInit, чтобы проверить, сохраняется ли какой-либо запрос. Затем я устанавливаю свойства сортировки active и direction вручную. И элементы фильтруют правильно. Единственная проблема заключается в том, что значок стрелки направления не отображается в заголовке столбца. Стрелка будет отображаться правильно, если пользователь щелкает столбец для сортировки, но если я установил сортировку вручную, элементы будут фильтр, но стрелка не отображается.

Как вручную настроить эти значки для правильного отображения при ручной настройке сортировки по параметрам маршрута?

Вот как установить сортировку из параметров маршрута:

setupRouteSubscription(): void {
    this.routeSubscription = this.activatedRoute.queryParams.subscribe((queryParam: Params) => {
      this.filterValues["name"] = queryParam["name"] || "";
      this.sort.active = queryParam["sort"];
      this.sort.direction = queryParam["sortDirection"];
      this.setupDataSource();
    });
  }

setupDataSource () - это место, где мы устанавливаем сортировку и фильтр:

setupDataSource() {
    this.dataSource.filterPredicate = this.buildTemplateFilter();
    this.dataSource.sort = this.sort;
  }

Пример URL будет выглядеть следующим образом: http://localhost:4200/home?sort=updatedTs&sortDirection=desc

И вот наглядное представление о том, что я пытаюсь получить: myDataTable Как видите, в столбце «Последние изменения» отображается значок, показывающий направление сортировки. Это произойдет, только если пользователь щелкнет по столбцу, я хочу сделать это в своем коде при получении параметров маршрута.

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