Как обновить / заменить данные в дереве угловых материалов - PullRequest
0 голосов
/ 26 июня 2019

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

Я пробовал разные решения, но многие из них устарели, например:

this.dataSource.data = null;
    this.dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
    this.dataSource.data = [];

, что выдает ошибку при попытке выравнивания нулевого объекта.

interface FlatNode {
  expandable: boolean;
  name: string;
  level: number;
}

@Component({
  selector: 'app-category-list',
  templateUrl: './category-list.component.html',
  styleUrls: ['./category-list.component.scss']
})
export class CategoryListComponent {
  dataChange = new BehaviorSubject<Category[]>([]);
  private _transformer = (node: Category, level: number) => {
    return {
      expandable: !!node.children && node.children.length > 0,
      name: node.name,
      level: level,
    };
  }

  treeControl = new FlatTreeControl<FlatNode>(
      node => node.level, node => node.expandable);

  treeFlattener = new MatTreeFlattener(
      this._transformer, node => node.level, node => node.expandable, node => node.children);

  dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);

  constructor(private categoryListService: CategoryListService) {this.dataSource.data = this.categoryListService.getTopCategories();}

  hasChild = (_: number, node: FlatNode) => node.expandable;

  ngOnInit() {
    this.dataChange.subscribe(data => {
      this.dataSource.data = data;
    });
  }

  }

  searchCategory(list: Category[]) {
    this.dataChange.next(list);
  }
}

Я хочу, чтобы источник данных обновил и повторно обработал дерево материалов.

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