如何使用离子过滤条过滤以下JSON

时间:2016-06-08 21:47:26

标签: angularjs ionic-framework

使用Ionic Filter Bar在离子应用中实现搜索,我需要从以下json中搜索"parent_type""child_type"

  {
  "status": {
    "code": 200,
    "message": "all data grabbed successfully",
    "cause": ""
  },
  "ParentData": [
    {
      "id": 67,
      "parent_type": "Parent Type",
      "child": [
        {
          "id": 86,
          "child_type": "Child Type"
        },
        {
          "id": 93,
          "child_type": "Child Type1"
        }
      ]
    },
    {
      "id": 68,
      "parent_type": "Parent Type 1",
      "child": [
        {
          "id": 87,
          "child_type": "Child Type 1"
        },
        {
          "id": 94,
          "child_type": "Child Type 2"
        }
      ]
    }
  ]
}

"parent_type"的工作正常,代码为

以下是过滤器代码

$scope.showFilterBar = function () {
      filterBarInstance = $ionicFilterBar.show({

        //setting parentData in following way after rest service call
        //$scope.parentData = jsondata.ParentData

        items: $scope.parentData,
        update: function (filteredItems, filterText) {
          $scope.parentData = filteredItems;
          if (filterText) {
            console.log(filterText);
          }
        },
         filterProperties: ['parent_type']
      });
    };

但无法搜索"child_type"

那么有没有办法设置filterProperties所以它适用于“parent_type”和“child_type”或任何其他方式来搜索这个Json?

感谢。

1 个答案:

答案 0 :(得分:3)

您应该删除“filterProperties”键,然后添加“表达式”键。 你的“filterBarInstance”将是这样的:

$scope.showFilterBar = function () {
  filterBarInstance = $ionicFilterBar.show({
    items: $scope.parentData,
    update: function (filteredItems, filterText) {
      $scope.parentData = filteredItems;
      if (filterText) {
        console.log(filterText);
      }
    },
    expression: function(filterText,value,index,array){
      // This function is called for every ParentData object.         
      // "value" will be the current ParentData object,
      // you'll need to iterate over all the "child" array in order to
      // check if any of the "child_type" keys contains the "filterText"
      // so if "parent_type" contains the "filterText" and any(? or all)
      // of the the "child[x].child_type" values also contains the
      // "filterText" return true
    }
  });
};

检查https://github.com/djett41/ionic-filter-bar以获取原始文档。

对不起我的英文:)