Question

我有一个搜索输入框和所有字母。这些东西基于输入进行搜索。现在，我正在搜索字母m，它给了我子列表，但是当我单击ALL时，元素没有重置。场景：最初点击"p-test17"左侧的按钮，这样我们就可以看到子元素列表。现在，单击M，或通过输入键搜索"m"，它会显示带有m的子元素。现在，单击ALL，它必须重设所有元素，但不像初始步骤中那样显示"p-test17"中的所有子元素。

请帮助。

TS：

searchFacility(search) {
    this.sLetter = search;
    let memberFacilities = true;
    if (search) {
      this.dtFacilities.expandedRows = [];
      setTimeout(() => {
        this.dtFacilities.expandedRows = this.dtFacilities.value;
        console.log(this.dtFacilities.value,"this.dtFacilities.value")
        this.dtFacilities.value.forEach(m => {
          m.memberFacilities.forEach(f => {
            let mySearch = search.toLowerCase();
            let facilityName = f.facilityName.toLowerCase();
            if (facilityName && facilityName.includes(mySearch)) {
              f.isShowMember = false;
              memberFacilities = false;
            } else {
              f.isShowMember = true;
              memberFacilities = true;
            }
          })
        })
        if (memberFacilities) {
          this.dtFacilities.expandedRows = [];
        } 
      }, 100);

    }
    if (search == "") {
      this.dtFacilities.expandedRows = [];
      this.dtFacilities.expandedRows = this.medicalOfficesList;
      this.medicalOfficesList.forEach(m => {
        m.memberFacilities.map(f => {
          f.isShowMember = false;
        })
      }) 
    }
    else {
      this.dtFacilities.expandedRows = [];
      this.dtFacilities.value.forEach(m => {
        m.memberFacilities.map(f => {
          f.isShowMember = false;
        })
      })

    }
  }

演示：DEMO

Answer 1

在mainArr.forEach(element => {之前的第22行的app.pipe.ts中添加：

mainArr = mainArr.map(e => {
  return {...e};
});

问题在于，当您通过medicalOfficesList管道运行searchMedicalOffices时，将替换memberFacilities上的mainArr（在本例中为medicalOfficesList ）和新的过滤后的数组。通过在第22行的上方添加新代码，您将在替换mainArr的{{1}}属性之前为memberFacilities中的每个对象创建一个新的（浅）副本。这样，原始的medicalOfficesList将保持不变。

如何使用angular2 primeng使子元素在搜索中显示并在全部单击时显示所有元素

1 个答案: