Berdasarkan objek filter, saya perlu memfilter data. Di bawah ini adalah objek filter dan data sampel dengan output yang diperlukan. Objek filter dihasilkan secara dinamis melalui komponen pencarian multi dari ui. Kemudian ketika pengguna menekan pencarian, data perlu disaring.

var filter = {
  city: 'pana',
  hospname: 'sara'
};
var data = [
  {
    "city": "Hot Springs",
    "hospname": "St. Vincent Hot Springs",
    "version": "VA48A",
    "sysid1": "CT67400",
    "type": "CompressedFile",
    "rowIndex": 0,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Panama City",
    "hospname": "Bay Medical Center",
    "version": "VA48A",
    "sysid1": "CT67399",
    "type": "CompressedFile",
    "rowIndex": 1,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Sarasota",
    "hospname": "Sarasota Memorial Hospital",
    "version": "VA44A",
    "sysid1": "C7393",
    "type": "CompressedFile",
    "rowIndex": 2,
    "selected": false,
    "disabled": true
  },
  {
    "city": "DAVENPORT",
    "hospname": "Genesis Medical Center",
    "version": "VA48A",
    "sysid1": "C6333",
    "type": "CompressedFile",
    "rowIndex": 6,
    "selected": false,
    "disabled": true
  }
];

Keluaran yang diharapkan:

[{
    "city": "Panama City",
    "hospname": "Bay Medical Center",
    "version": "VA48A",
    "sysid1": "CT67399",
    "type": "CompressedFile",
    "rowIndex": 1,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Sarasota",
    "hospname": "Sarasota Memorial Hospital",
    "version": "VA44A",
    "sysid1": "CT67393",
    "type": "CompressedFile",
    "rowIndex": 2,
    "selected": false,
    "disabled": true
  }]
1
Nishanth 23 Desember 2020, 15:32

3 jawaban

Jawaban Terbaik

Saya mulai dengan versi yang lebih umum di mana Anda dapat menambahkan atribut pada objek filter.

var filter = {
  city: 'pana',
  hospname: 'sara'
};
var data = [
  {
    "city": "Hot Springs",
    "hospname": "St. Vincent Hot Springs",
    "version": "VA48A",
    "sysid1": "CT67400",
    "type": "CompressedFile",
    "rowIndex": 0,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Panama City",
    "hospname": "Bay Medical Center",
    "version": "VA48A",
    "sysid1": "CT67399",
    "type": "CompressedFile",
    "rowIndex": 1,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Sarasota",
    "hospname": "Sarasota Memorial Hospital",
    "version": "VA44A",
    "sysid1": "C7393",
    "type": "CompressedFile",
    "rowIndex": 2,
    "selected": false,
    "disabled": true
  },
  {
    "city": "DAVENPORT",
    "hospname": "Genesis Medical Center",
    "version": "VA48A",
    "sysid1": "C6333",
    "type": "CompressedFile",
    "rowIndex": 6,
    "selected": false,
    "disabled": true
  }
];

let results;

if (Object.keys(filter).length === 0)
  results = data;
else {
  results = data.filter((item) => {
      return Object.keys(filter).find(key => {
          return item[key] && item[key].toLowerCase().includes(filter[key].toLowerCase());
      });
  });  
}

console.log(results);
1
Marco 23 Desember 2020, 13:08
var filter = {
  city: 'pana',
  hospname: 'sara'
};
var data = [
  {
    "city": "Hot Springs",
    "hospname": "St. Vincent Hot Springs",
    "version": "VA48A",
    "sysid1": "CT67400",
    "type": "CompressedFile",
    "rowIndex": 0,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Panama City",
    "hospname": "Bay Medical Center",
    "version": "VA48A",
    "sysid1": "CT67399",
    "type": "CompressedFile",
    "rowIndex": 1,
    "selected": false,
    "disabled": true
  },
  {
    "city": "Sarasota",
    "hospname": "Sarasota Memorial Hospital",
    "version": "VA44A",
    "sysid1": "C7393",
    "type": "CompressedFile",
    "rowIndex": 2,
    "selected": false,
    "disabled": true
  },
  {
    "city": "DAVENPORT",
    "hospname": "Genesis Medical Center",
    "version": "VA48A",
    "sysid1": "C6333",
    "type": "CompressedFile",
    "rowIndex": 6,
    "selected": false,
    "disabled": true
  }
];

const result=data.filter(item=>item.city.toLowerCase().includes(filter.city.toLowerCase()) || item.hospname.toLowerCase().includes(filter.hospname.toLowerCase()) )

console.log(result)
.as-console-wrapper { max-height: 100% !important; top: 0; }
1
Nilesh Patel 23 Desember 2020, 12:39

Di ES6 Anda bisa melakukannya seperti ini

var results = data.filter(function(item)=>{
   return item.city === filter.city || item.hospname === filter.hospname;
});

Selamat mengkode!

0
Dharman 23 Desember 2020, 12:46