Question

我将尝试用一个例子解释我的问题：

HTML代码：

<body>
  <input type="search" placeholder="filter by line" ng-model="filter.line">
  <input type="search" placeholder="filter by area" ng-model="filter.area">
  <input type="search" placeholder="filter by text" ng-model="filter.text">
  <div>
    <tbody ng-repeat="document in result.documents | filter:{line:filter.line} |filter:{area:filter.area}">
    <tr>
      <td>{{document.line}}</td>
      <td>{{document.area}}</td>
      <td>{{document.sentences}}</td>
    </tr>
    </tbody>

我的数据示例：

$scope.result = {
documents: {
            {code:"1",
            line:"line1",
            area:"area1",
            sentences:
             {
                {"aaaaa"},
                {"bbbb"},
                {"ccccc"}
              }
            },
            {code:"2",
            line:"line2",
            area:"area2",
            sentences:
              {
                {"dddd"},
                {"eeee"},
                {"ffff"}
              }
            }

        }};

所以我要做的是使用输入“filter.text”添加一个过滤器，仅在“句子”列中过滤。

类似

filter:{sentences:filter.text}

我怎么做？

Answer 1

var myApp = angular.module('myApp', [])
                myApp.controller("userCtrl", function ($scope) {
                $scope.filter_t={};
                $scope.result = {
                        documents:
                                [{"code":0,"line":"line0","area":"aaa0","sentences":{"id":0}},{"code":1,"line":"line1","area":"aaa1","sentences":{"id":1}},{"code":2,"line":"line2","area":"aaa2","sentences":{"id":2}},{"code":3,"line":"line3","area":"aaa3","sentences":{"id":3}},{"code":4,"line":"line4","area":"aaa4","sentences":{"id":4}},{"code":5,"line":"line5","area":"aaa5","sentences":{"id":5}},{"code":6,"line":"line6","area":"aaa6","sentences":{"id":6}},{"code":7,"line":"line7","area":"aaa7","sentences":{"id":7}},{"code":8,"line":"line8","area":"aaa8","sentences":{"id":8}},{"code":9,"line":"line9","area":"aaa9","sentences":{"id":9}}]
                }

    })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="userCtrl">

       <input type="search" placeholder="filter by line" ng-model="filter_t.line">
  <input type="search" placeholder="filter by area" ng-model="filter_t.area">
  <input type="search" placeholder="filter by sentences inside id based" ng-model="filter_t.sentences.id">
  <div>
<table border='1'>
    <tbody ng-repeat="document in result.documents | filter:filter_t">
    <tr>
      <td>{{document.line}}</td>
      <td>{{document.area}}</td>
      <td>{{document.sentences.id}}</td>
    </tr>
   </tbody>
</table>
</div>

Answer 2

试试这个数据，

$scope.result = {
documents: {
                {code:"1",
                line:"line1",
                area:"area1",
                sentences:
                 {
                    {"aaaaa"},
                    {"bbbb"},
                    {"ccccc"}
                  }
                },
                {code:"2",
                line:"line2",
                area:"area2",
                sentences:
                  {
                    {"dddd"},
                    {"eeee"},
                    {"ffff"}
                  }
                }

            }
};

Angular JS - 过滤包含数组的表列中的文本

2 个答案: