Question

我在组件中有一个数组，并且基于searchString我正在过滤项目数组。而且工作正常。如果用户从搜索字段中删除字符，我想再次显示所有记录。但清除搜索字段中的项目时，我无法再次显示所有记录。

请参见下面的代码。

 this.filterServ.filterData.subscribe(searchData => {
         if (Object.keys(searchData).length != 0) {
            console.log('component', searchData);
           this.cardData = this.cardData.filter((project) => {
               let name = project.Name.toLowerCase();
               if (name.includes(searchData.searchString.toLowerCase())) {
                  return true;
               }
            });
           console.log('filterd data', this.cardData);
         }
      });

Answer 1

您已经突变了.videomodal .modal-dialog { max-width: 800px; margin: 30px auto; } .videomodal .modal-body { position:relative; padding:0px; } .videomodal .close { position:absolute; right:-30px; top:0; z-index:999; font-size:2rem; font-weight: normal; color:#fff; opacity:1; } .cursor-pointer{ cursor: pointer; }。因此，您无法将其还原。

解决方案是创建另一个属性，例如，您可以将其命名为cardData。

然后您可以这样做：

displayData

，而不是在模板上使用this.displayData = this.cardData.filter((project) => {，而是使用cardData

Answer 2

您应在过滤之前复制数组数据，如果输入文本为空，则返回原始数组。

    private originalData;

    this.originalData = this.cardData.slice();
    this.filterServ.filterData.subscribe(searchData => {
         if (Object.keys(searchData).length != 0) {
            console.log('component', searchData);
           this.cardData = this.originalData.filter((project) => {
               let name = project.Name.toLowerCase();
               if (name.includes(searchData.searchString.toLowerCase())) 
               {
                  return true;
               }
            });
           console.log('filterd data', this.cardData);
         }
      });

Answer 3

声明字段this.filterServ.filterData.subscribe(searchData => { if (Object.keys(searchData).length != 0) { console.log('component', searchData); this.filterData= this.cardData.filter((project) => { let name = project.Name.toLowerCase(); if (name.includes(searchData.searchString.toLowerCase())) { return true; } }); console.log('filterd data', this.cardData); } });并将此字段绑定到模板中。

private String getContactName(String number, Context context) {

       String contactName  = "";

       String[] projection = new String[] {
            ContactsContract.PhoneLookup.DISPLAY_NAME,
            ContactsContract.PhoneLookup.NUMBER,
            ContactsContract.PhoneLookup.HAS_PHONE_NUMBER };


       Uri contactUri = Uri.withAppendedPath(
            ContactsContract.PhoneLookup.CONTENT_FILTER_URI,
            Uri.encode(number));


       Cursor cursor = context.getContentResolver().query(contactUri,
            projection, null, null, null);


       if(cursor != null) {
        if (cursor.moveToFirst()) {
            contactName = cursor.getString(cursor
                    .getColumnIndex(ContactsContract.PhoneLookup.DISPLAY_NAME));
        }
        cursor.close();

       }

       return contactName.equals("") ? number : contactName;

}

希望获得帮助！

角度移除滤镜后无法恢复原始阵列？

3 个答案: