如何为一个列表添加多个过滤器，并在angular 7中分别取消选中它们？

在Angular 7中，可以通过使用管道（pipe）来为列表添加多个过滤器，并且可以分别取消选中它们。下面是一个完整的解答：

在Angular中，可以使用管道来过滤列表数据。首先，你需要创建一个自定义的管道来实现多个过滤器的功能。以下是一个示例：

创建一个名为multiFilter的自定义管道：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'multiFilter'
})
export class MultiFilterPipe implements PipeTransform {
  transform(items: any[], filters: any[]): any[] {
    if (!items || !filters) {
      return items;
    }

    return items.filter(item => {
      for (let filter of filters) {
        if (!filter || !filter.value) {
          continue;
        }

        if (item[filter.key] !== filter.value) {
          return false;
        }
      }

      return true;
    });
  }
}

在你的组件中，定义一个列表和多个过滤器：

import { Component } from '@angular/core';

@Component({
  selector: 'app-list',
  template: `
    <ul>
      <li *ngFor="let item of items | multiFilter:filters">{{ item.name }}</li>
    </ul>
  `
})
export class ListComponent {
  items: any[] = [
    { name: 'Item 1', category: 'Category A', color: 'Red' },
    { name: 'Item 2', category: 'Category B', color: 'Blue' },
    { name: 'Item 3', category: 'Category A', color: 'Green' },
    { name: 'Item 4', category: 'Category C', color: 'Red' },
    { name: 'Item 5', category: 'Category B', color: 'Yellow' }
  ];

  filters: any[] = [
    { key: 'category', value: '' },
    { key: 'color', value: '' }
  ];
}

在模板中使用管道来过滤列表数据，并提供取消选中的功能：

<div>
  <label>Category:</label>
  <select [(ngModel)]="filters[0].value">
    <option value="">All</option>
    <option value="Category A">Category A</option>
    <option value="Category B">Category B</option>
    <option value="Category C">Category C</option>
  </select>
</div>

<div>
  <label>Color:</label>
  <select [(ngModel)]="filters[1].value">
    <option value="">All</option>
    <option value="Red">Red</option>
    <option value="Blue">Blue</option>
    <option value="Green">Green</option>
    <option value="Yellow">Yellow</option>
  </select>
</div>

<button (click)="resetFilters()">Reset Filters</button>

在组件中添加取消选中的方法：

resetFilters() {
  this.filters.forEach(filter => {
    filter.value = '';
  });
}

通过以上步骤，你就可以为一个列表添加多个过滤器，并且可以分别取消选中它们。在上述示例中，我们创建了一个自定义管道multiFilter，它接受两个参数：items表示要过滤的列表数据，filters表示过滤器的配置。在组件中，我们定义了一个列表items和多个过滤器filters，并在模板中使用管道来过滤列表数据。通过选择不同的过滤条件，列表会根据过滤器的配置进行过滤显示。同时，我们还提供了一个重置按钮，点击按钮后可以取消选中所有过滤条件。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）、腾讯云对象存储（COS）、腾讯云数据库MySQL版（TencentDB for MySQL）等。你可以通过访问腾讯云官方网站获取更多关于这些产品的详细信息和文档。

注意：以上答案仅供参考，具体实现方式可能因个人需求和项目配置而有所不同。