Angular 不通过下拉选项过滤表格答案

【问题标题】：Angular not filtering table by dropdown optionsAngular 不通过下拉选项过滤表格
【发布时间】：2021-05-05 03:57:12
【问题描述】：

我有一个包含数据库数据的表，我需要使用下拉菜单过滤该表。问题是，即使我设法在控制台上获得过滤后的表格，表格也没有被过滤：它只是前端没有显示。我的过滤功能如下：

FiltrarTipoGestion(data) {
    let tipoGestion = data;
    if (data != "0") {      
        this.listPerfilamiento2 = this.listPerfilamiento.filter(x => x.tipoGestionDescripcion.toLowerCase() == tipoGestion.toLowerCase());
    } else {
        this.listPerfilamiento2 = this.listPerfilamiento;
    }
}

HTML 中的过滤器是这样的：

        <label class="col-lg-1 float-left">Tipo de gestión</label>
        <div class="col-lg-2 float-left">
            <select (change)="FiltrarTipoGestion($event.target.value)" [(ngModel)]="perfilamiento.tipoGestionDescripcion" class="form-control form-control-sm">
                <option *ngFor="let tg of listTipoGestion;" value="{{tg.nombre}}">{{tg.nombre}}</option>
            </select>
        </div>

我减少了前端过滤器中的错误，因为当我执行console.log 时，我能够过滤数据。任何帮助或提示表示赞赏。

编辑：数组从这里获取数据：

this._service.getListarPerfilamiento(this.TipoPerfilId).subscribe((data) => {
  this.listPerfilamiento = data['data'];
  this.listPerfilamiento2 = data['data'];
  this.listPerfilamientoAll = data['data'];
 
  if (this.TipoPerfilId == 1) {
    this.ShowAgencia = true;
    this.ShowMensajeria = false;


  } else {
    this.ShowAgencia = false;
    this.ShowMensajeria = true;
  }
})

【问题讨论】：

请分享表格模板以及 this.listPerfilamiento2 如何链接到表格。
如果你能提供stackblitz链接那就太好了
当然，我会编辑我的答案。 @DRASHTIDOBARIYA，很抱歉问，如果我有数据库中的数据，它还能工作吗？我是使用 stackblitz 的新手。
您能否与我们分享您定义表格的 HTML 模板，或者重现该行为的 StackBlitz ？如果您的数据是从 API/DB 调用中获取的，请通过直接传递来模拟数据
当然，我制作了模型：stackblitz.com/edit/angular-ivy-ty7ru4?file=src/app/… 我在下拉 $event.target.value 时遇到问题，它不允许我说，属性“值”确实在“EventTarget”类型上不存在，但除此之外，这是我拥有的表，我需要下拉列表中的每个选项来过滤表，这是我无法做到的。

标签： html angular typescript

【解决方案1】：

我发现了问题：我需要使用 ngFor 上的过滤列表来显示新数组：我变了

<tr *ngFor="let pf of listarPerfilamiento; index as i; let l = count;" style="cursor: pointer;">

为

<tr *ngFor="let pf of filteredPerfilamiento; index as i; let l = count;" style="cursor: pointer;">

感谢大家花时间阅读和评论。

【讨论】：