如何使用地图过滤嵌套数组并使用对象过滤

时间:2019-05-05 18:21:37

标签: javascript angular typescript

我想返回json数据比较日期过滤器值。我正在使用Array.Filter和Map 我尝试了下面的代码,它不能正常工作,请您解释一下如何使用过滤器映射

获取返回的json比较特定日期

内部可用性对象代码中的数组与日期比较,但我没有得到返回值

我想比较日期过滤器值

我在我的代码下方添加了。

let cruiseFilterData = [{
      "name":"text--1",
      "availabilities":{
         "2019":{
            "year":"2019",
            "items":[
               {
                  "discount":{
                     "name":"one"
                    },
                  "dateDepart":"12\/10\/2019"
                },
               {
                  "discount":{
                     "name":"Two"
                  },
                  "dateDepart":"15\/12\/2019"
                }
            ]
         }
      },
      "sort":0,
      "featured":true
   },
   {
      "name":"text--2",
      "availabilities":{
         "2019":{
            "year":"2019",
            "items":[
               {
                  "discount":{
                     "name":"one"
                    },
                  "dateDepart":"18\/05\/2019"
                },
               {
                  "discount":{
                     "name":"two"
                  },
                  "dateDepart":"12\/10\/2019"
               }
            ]
         }
      },
      "sort":1,
      "featured":true
   },
   {
      "name":"text--3",
      "availabilities":{
         "2019":{
            "year":"2019",
            "items":[
               {
                  "discount":{
                     "name":"one"
                  },
                  "dateDepart":"25\/05\/2019"
                },
               {
                  "discount":{
                     "name":"two"
                  },
                  "dateDepart":"12\/10\/2019"
               }
            ]
         }
      },
      "sort":2,
       "featured":true
   },
    {
      "name":"text--4",
      "availabilities":null,
      "sort":2,
       "featured":true
   }
]

let compareDate = 'Sat Oct 12 2019 00:00:00 GMT+0400 (Mauritius Standard Time)';

const linkedItinery = cruiseFilterData.map((element) => {
    element.availabilities = Object.keys(element.availabilities).filter((value, index) => {
        element.availabilities[value].items.filter((value, index) => {
            const dateValue = value.dateDepart;
            if (dateValue.indexOf('/') >= 0) {
                const dateSpilt = dateValue.split(' ')[0];
                const parts = dateSpilt.split('/');
                if (parts) {
                    const dateMerge = '' + parts[1] + '/' + parts[0] + '/' + parts[2];
                    propDate = new Date(dateMerge);
                } else {
                    propDate = new Date(dateValue);
                }
            }
            if(propDate.toDateString() === compareDate.toDateString()) {
                return value;
            }
        });
        return value;
    });
    return element;
});

console.log(linkedItinery);

1 个答案:

答案 0 :(得分:0)

如果您的目标是根据用户日期选择(此处用变量compareDate表示)来过滤可用航次列表,那么我不是100%肯定会了解您到目前为止想要达到的目标。您可以按照以下方式更新代码:

    let cruiseFilterData = [{
          "name":"text--1",
          "availabilities":{
             "2019":{
                "year":"2019",
                "items":[
                   {
                      "discount":{
                         "name":"one"
                        },
                      "dateDepart":"12/10/2019"
                    },
                   {
                      "discount":{
                         "name":"Two"
                      },
                      "dateDepart":"15/12/2019"
                    }
                ]
             }
          },
          "sort":0,
          "featured":true
       },
       {
          "name":"text--2",
          "availabilities":{
             "2019":{
                "year":"2019",
                "items":[
                   {
                      "discount":{
                         "name":"one"
                        },
                      "dateDepart":"18/05/2019"
                    },
                   {
                      "discount":{
                         "name":"two"
                      },
                      "dateDepart":"12/10/2019"
                   }
                ]
             }
          },
          "sort":1,
          "featured":true
       },
       {
          "name":"text--3",
          "availabilities":{
             "2019":{
                "year":"2019",
                "items":[
                   {
                      "discount":{
                         "name":"one"
                      },
                      "dateDepart":"25/05/2019"
                    },
                   {
                      "discount":{
                         "name":"two"
                      },
                      "dateDepart":"12/10/2019"
                   }
                ]
             }
          },
          "sort":2,
           "featured":true
       },
        {
          "name":"text--4",
          "availabilities":null,
          "sort":2,
           "featured":true
       }
    ]
    
    let compareDate = new Date(2019, 12, 15); // Year, month, day.
    
    let linkedItinery = cruiseFilterData.filter((cruise) => {
        // Exclude all cruise without any availabilities
        if(!cruise.availabilities) return false;
        // check if current cruise have at least one availability for selected date.
        return Object.values(cruise.availabilities).findIndex(availability => {
           return availability.items.findIndex((item) => {
              // First we split the date by /.
              const [day, month, year] = item.dateDepart.split('/');
              // We craft date.
              const dateValue = new Date(year, month, day);
              // We compare both date to check if is the same.
              return dateValue.getTime() === compareDate.getTime();
           }) !== -1;
        }) !== -1; // -1 means not found. Is intersting to use findIndex here because he will stop the loop as soon as he find the first element which match with your callback critera. That avoid overlooping.
    });
    
    console.log(linkedItinery);

首先,我更改了您的compareDate但纯粹的Date对象。

然后我按嵌套条件过滤原始列表。我的目标是找到具有可用性的Cruiser,并在此可用性内检查是否至少有一个日期与用户输入匹配。


请告诉我您是否不满意,我会根据您的说明更新代码。