簡體   English   中英

JSON對象上有多個過濾器?

[英]Multiple filters on a json object?

我為單個json對象設置了10個過濾器:

var filtro1 = function(value, selecionado){
    var data = JSON.parse(JSON.stringify(json.aPesquisa));
    var result = data.filter(function(pesquisa){
        ...
    });
    return result;
}

var filtro2 = function(value, selecionado){
    var data = JSON.parse(JSON.stringify(json.aPesquisa));
    var result = data.filter(function(pesquisa){
        ...
    });
    return result;
}

var filtro3 = function(horamin, horamax){
    var data = JSON.parse(JSON.stringify(json.aPesquisa));
    var result = data.filter(function(pesquisa){
        ...
    });
    return result;
}

var filtro4 = function(value, selecionado){
    var data = JSON.parse(JSON.stringify(json.aPesquisa));
    var result = data.filter(function(pesquisa){
        ...
    });
    return result;
}
...

等等。 如您所見,每個過濾器都是分開工作的,即如果我先用filtro1過濾,然后再用filtro2過濾,則只顯示filtro2。

有什么辦法可以使這些過濾器在一起?

我考慮過使用帶有選定過濾器的數組:

var filtros = ["filtro1, "filtro2", "filtro6", "filtro9", "filtro10"];

但是我不能。

一個想法,並鏈接過濾器。

更多信息:

測試JSON:

{
  "aPesquisa":[
    {
      "trecho":[
        {
          "info":[
            {
              "cor":{
                "nm":"Laranja"
              },
              "dtPartida":"20170620 11:20",
              "dtChegada":"20170620 16:40",
              "hrDuracao":"03:20",
              "vTarifa":{
                "tarifa":{
                  "vlTotal":1969.17
                }
              }
            }
          ]
        },
        {
          "info":[
            {
              "cor":{
                "nm":"Vermelho"
              },
              "dtPartida":"20170620 11:20",
              "dtChegada":"20170620 16:40",
              "hrDuracao":"03:25",
              "vTarifa":{
                "tarifa":{
                  "vlTotal":769.90
                }
              }
            },
            {
              "cor":{
                "nm":"Vermelho"
              },
              "dtPartida":"20170620 11:20",
              "dtChegada":"20170620 16:40",
              "hrDuracao":"03:30",
              "vTarifa":{
                "tarifa":{
                  "vlTotal":2969.20
                }
              }
            },
            {
              "info":[
                {
                  "cor":{
                    "nm":"Azul"
                  },
                  "dtPartida":"20170620 11:20",
                  "dtChegada":"20170620 16:40",
                  "hrDuracao":"03:20",
                  "vTarifa":{
                    "tarifa":{
                      "vlTotal":669.17
                    }
                  }
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

我的10個過濾器中的兩個:

//DURATION FILTER
var filtroDuracao =  function(horamin, horamax)
{
  var data = JSON.parse(JSON.stringify(json.aPesquisa));
  var result = data.filter(function(item){
    var voos = item.trecho[0].info.filter(function(info){
      var time = horasParaMinutos(info.hrDuracao);
      return time >= horamin && time <= horamax;
    });
    item.trecho[0].voo = voos;
    return voos.length > 0;
  });
  return result;
};


// COLOR FILTER
var cores = [];
var filtroCor = function(value, selecionado){
  var sgv = value.split('|')[0];

  if (selecionado) {
    Array.prototype.push.apply(cias, json.aPesquisa.filter(function(pesquisa){
      var nm = pesquisa.trecho[0].info[0].cor.nm;
      return nm == sgv;
    }));
  } else {
    cias = cores.filter(function(pesquisa) {
      var nm = pesquisa.trecho[0].info[0].cor.nm;
      return nm != sgv;
    });
  }

  return cores;
}

filtroDuracao我花了幾分鍾從滑道游騎兵那里得到了Horamin和Horamax。

並在filtroCor我傳遞的值value復選框,它是否被選中或不selected ,以濾除多種顏色。

顏色復選框代碼(JavaScript):

$(".filtros input[name='cores']").on('change', function(event) {
    var value = $(this).val();
    filtroCor(value, this.checked);
});

幻燈片游俠代碼(JavaScript):

$("#duracao-range").slider({
            range: true,
            min: 0,
            max: 1440, //1440 / 60 = 24
            step: 15,
            values: [0, 1439],
            slide: function(event, ui) {
                //Mínimo
                //calcula as horas, exemplo: 125 / 60 = 2,083, arredonda para 2
                var hoursMin = Math.floor(ui.values[0] / 60);
                //calcula os minutos, exemplo: 125 - 2 * 60 = 5
                //No final terá horas = 2 e minutos = 5
                var minutesMin = ui.values[0] - (hoursMin * 60); //restante são os minutos
                //acrescenta o zero a esquerda se houver apenas 1 digito, 1 = 01, 2 = 02 e etc...
                if (hoursMin.toString().length == 1) hoursMin = '0' + hoursMin;
                if (minutesMin.toString().length == 1) minutesMin = '0' + minutesMin;
                $(".min-duracao-label").html(hoursMin + ':' + minutesMin);
                //Máximo
                var hoursMax = Math.floor(ui.values[1] / 60);
                var minutesMax = ui.values[1] - (hoursMax * 60);
                if (hoursMax.toString().length == 1) hoursMax = '0' + hoursMax;
                if (minutesMax.toString().length == 1) minutesMax = '0' + minutesMax;
                $(".max-duracao-label").html(hoursMax + ':' + minutesMax);

               var horaminida= horasParaMinutos(hoursMin + ':' + minutesMin));
               var horamaxida= horasParaMinutos(hoursMax + ':' + minutesMax));
               filtroDuracao(horaminida, horamaxida);

            }
        });

horasParaMinutos函數將小時轉換為分鍾:

var horasParaMinutos = function (str) {
  var horas = str.split(':').map(Number);
  return horas[0] * 60 + horas[1];
}

我的疑問之一和以下幾點:

我有一個持續時間復選框列表,其中選中了3個,然后選擇了一個顏色復選框。 如何獲取持續時間和顏色復選框以進行過濾?

您可以將filter函數與數組中的綁定參數一起使用,並應用reduce。

 var array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20], filter1 = function(left, right, item) { return item >= left && item <= right; }, filter2 = function(value, item) { return !(item % value); }, filters = [filter1.bind(null, 1, 10), filter2.bind(null, 3)], result = filters.reduce((a, fn) => a.filter(fn), array); console.log(result); 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM