Nested Array Iteration for array of objects find all values search filter

Question

Issue Unable to return testcaseid from array to this.filteredArray

able to return header value and all values of array if search word is empty.

help me on this.

help how to iterate testcaseid and header on search input filed.

Array -

 PanelList$: any[] =
[
   {
      "header":"header1",
      "data":[
         {
            "testcaseId":"tz_param",
            "description":"tz_param"
         },
         {
            "testcaseId":"tzication",
            "description":"tzication"
         }
      ]
   },
   {
      "header":"security",
      "data":[
         {
            "testcaseId":"tz_prompt",
            "description":"tz_prompt"
         },
         {
            "testcaseId":"z_Root_CA",
            "description":"z_Root_CA"
         },
         {
            "testcaseId":"tz_part1",
            "description":"tz_part1"
         }
      ]
   }
]

input search code -

 <input matInput (keyup)="applyFilter($event.target.value);" autocomplete="off" placeholder="Search Test Cases...">

Filter Function - to search header and testcase id

applyFilter(filterWord) {

let arraycase;
let arraycase1;

const word = filterWord.toString().toLowerCase();

this.filteredArray = this.PanelList$.filter(his => {

    if(his.header.toString().toLowerCase() ===  word) {
      console.log('1' + 'header')
      return his}


    if(his.header.toString().toLowerCase().includes(word)) {
      console.log('2' + 'return full array')
      return his}

   his.data.filter(ids => { 

      if(ids.testcaseId.toString().toLowerCase() ===  word) {
        console.log('3')

        arraycase = [{header: his.header, data: [ids] }]
        console.log(arraycase);
        return  arraycase
      } {

      return  arraycase
      }
      
    })

    console.log(arraycase1 + 'asdads');
  
})

Update 1 -

      this.PanelList$ = JSON.parse(msg.data);
      this.filteredArray = JSON.parse(msg.data);

both this.PanelList$ and this.filteredArray has same array

for empty word it will return entire array as mentioned in this.PanelList$ — Abhinav Sharma
– Abhinav Sharma, Commented May 9, 2021 at 10:13

Abhinav Sharma · Accepted Answer · 2021-05-09 19:51:34Z

1

Final Answer to my question - i am returning the value as i am expected -

applyFilter(filterWord) {
    console.log(this.PanelList$);
    let arraycase;
    const word = filterWord.toString().toLowerCase();

    this.filteredArray = this.PanelList$.map((his) => {
      if (his.header.toString().toLowerCase() === word) {
        return his;
      }

      if (his.header.toString().toLowerCase().includes(word)) {
        return his;
      }

      arraycase = [];

      his.data.filter((ids) => {
        if (ids.testcaseId.toString().toLowerCase() === word) {
          arraycase = { header: his.header, data: [ids] };
          console.log(arraycase);
          return arraycase;
        }
      });
      return arraycase;
    });


    if (this.filteredArray[0].length === 0) {
      this.testCaseIdTable = true;
    }
  }

answered May 9, 2021 at 19:51

Abhinav Sharma

313 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sermet Pekin · Accepted Answer · 2021-05-09 09:54:00Z

Since I do not have all of your code I just added some required modifications so that I can test and you can have an idea how to modify your code.

  //applyFilter(filterWord) {

let arraycase;
let arraycase1;

PanelList =
[
   {
      "header":"TestBootNotification_CS",
      "data":[
         {
            "testcaseId":"tc_real_module_param",
            "description":"tc_real_module_param"
         },
         {
            "testcaseId":"tc_BootNotification",
            "description":"tc_BootNotification"
         }
      ]
   },
   {
      "header":"security",
      "data":[
         {
            "testcaseId":"tc_with_prompt",
            "description":"tc_with_prompt"
         },
         {
            "testcaseId":"tc_install_Root_CA",
            "description":"tc_install_Root_CA"
         },
         {
            "testcaseId":"tc_install_client_cert_part1",
            "description":"tc_install_client_cert_part1"
         }
      ]
   }
]

   
  var word =  "TestBootNotification_CS".toString().toLowerCase();  //filterWord.toString().toLowerCase();

this.filteredArray = 
PanelList.map( 
    (his) => {

        if(his.header.toString().toLowerCase() ===  word) {
          console.log('1' + 'header')
          return his}
    
    
        if(his.header.toString().toLowerCase().includes(word)) {
          console.log('2' + 'return full array')
          return his}
    
          arraycase = [] 
          his.data.filter(ids => { 
    

          if(ids.testcaseId.toString().toLowerCase() ===  word) {
            console.log('3')
    
            // arraycase = [{header: his.header, data: [ids] }]
            var obj = {header: his.header, data: [ids] }
            arraycase.push( obj )
            console.log(arraycase);
            return  arraycase
          } else {
    
          return  arraycase
          }
          
        })
    
        console.log(arraycase1 + 'asdads') 
    }
 

 )



console.log( this.filteredArray  )

after using your code getting error - ERROR TypeError: Cannot read property 'header' of undefined

Collectives™ on Stack Overflow

Nested Array Iteration for array of objects find all values search filter

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related