我在我的应用程序中使用MEAN堆栈并将AngularJS作为我的前端。如何过滤count and quality字段，我需要drop down list来获取第一个搜索选择输入中的计数值和质量值第二次搜索选择输入，我希望过滤count and quality values ...我在ng-options和ng-module中犯了一个错误，所以如果有人知道解决方案的话帮助我们感谢.... My Plunker
我的Html： -
<div class="col-md-6 form-group form-group-default">
<label>Count</label> <select data-ng-model="searchtable.count" id="count" ng-options="item.count for item in sryarnorder.colorshades" class="form-control"><option value="">All</option></select>
</div>
<div class="col-md-6 form-group form-group-default">
<label>Quality</label>
<select data-ng-model="searchtable.quality" id="quality" ng-options="item.quality for item in sryarnorder.colorshades" class="form-control" >
<option value="">All</option>
</select>
</div>
NG-选项： -
我在这里做了一个错误，这就是为什么下拉列表没有显示的原因。
ng-options="item.count for item in sryarnorder.colorshades"
ng-options="item.quality for item in sryarnorder.colorshades"
数据-NG模块： -
请检查我的ng-module是否完美无缺。
data-ng-model="searchtable.count"
data-ng-model="searchtable.quality"
我创建了Plunker作为参考： - My plunker
例如： - 如果下拉列表为yarn count , carn count ,burn count ..如果我选择yarn count该特定交易只需要显示....请帮助。
答案 0 :(得分：0)
查看your plunker，主要问题（为什么没有选项在您的下拉列表中呈现）是您引用的sryarnorder尚未存在。它后来在你的table / tr <tr ng-repeat="sryarnorder in sryarnorders | filter:searchtable">中定义。这可能是一种类型。您可能想要引用在MainCtrl的$ scope级别定义的sryarnorders。你可以这样做：
<select data-ng-model="searchtable.count" id="count" ng-options="item.colorshades[0].count for item in sryarnorders" class="form-control">
<option value="">All</option>
</select>
和
<select data-ng-model="searchtable.quality" id="quality" ng-options="item.colorshades[0].quality for item in sryarnorders" class="form-control" >
<option value="">All</option>
</select>
通过您提供的数据，您可以获得所需的结果。
答案 1 :(得分：0)
您需要自定义JSON以使用数组中的数组，或者您应该在ng-repeat内部ng-repeat来实现该方案。
SCRIPT和HTML
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.sryarnorders = [
{
"_id": "573d7fa0760ba711126d7de5",
"user": {
"_id": "5721a378d33c0d6b0bb30416",
"displayName": "ms ms"
},
"__v": 1,
"colorshades": [{
"_id": "573d7fc3760ba711126d7de6",
"quality": "Home Textiles",
"count": "yarn count"
},
{
"_id": "579ef3feba3bac040b583b50",
"color": "56a5b6831746bc1c0b391c7c",
"quality": "Hall Textiles",
"count": "carn count"
}],
"created": "2016-05-19T08:56:00.997Z",
"actual_delivery_date": "2016-05-19",
"ex_india_date": "2016-05-19",
"ex_factory_date": "2016-05-19",
"po_delivery_date": "2016-05-19",
"supplier_name": "Fsa",
"buyer_name": "e21"
},
{
"_id": "56ffc6d5ab97a73d1066b798",
"user": {
"_id": "56ff7bece2b9a1d10cd074a3",
"displayName": "saravana kumar"
},
"__v": 1,
"colorshades": [{
"_id": "56ffc723ab97a73d1066b799",
"quality": "Hall Textiles",
"count": "burn count"
}],
"created": "2016-04-02T13:19:17.746Z",
"actual_delivery_date": "2016-04-02",
"ex_india_date": "2016-04-04",
"ex_factory_date": "2016-04-02",
"po_delivery_date": "2016-04-02",
"supplier_name": "Fsa",
"buyer_name": "Binary hand"
},
{
"_id": "56ffc5e0ab97a73d1066b796",
"user": {
"_id": "56ff7bece2b9a1d10cd074a3",
"displayName": "saravana kumar"
},
"__v": 1,
"colorshades": [{
"_id": "56ffc608ab97a73d1066b797",
"quality": "yarn quality",
"count": "carn count"
}],
"created": "2016-04-02T13:15:12.876Z",
"ex_india_date": "2016-04-02",
"ex_factory_date": "2016-04-02",
"po_delivery_date": "2016-04-02",
"supplier_name": "Fsa",
"buyer_name": "e21"
}];
});<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<div class="com-md-6">
<div class="col-md-6 form-group form-group-default">
<label>Count</label> <select ng-model="searchtable.count" id="count" ng-options="items['count'] for items in sryarnorders[0]['colorshades']" class="form-control">
<option value="">All</option>
</select>
</div>
<div class="col-md-6 form-group form-group-default">
<label>Quality</label>
<select ng-model="searchtable.quality" id="quality" ng-options="item.quality for item in sryarnorders[0].colorshades" class="form-control" >
<option value="">All</option>
</select>
<table ng-table="tableParams" show-filter="true" class="table table-bordered ">
<thead>
<tr>
<th rowspan="2"> S.no </th>
<th colspan="2" width="100%"> description </th>
<th rowspan="2"> Po Delivery Date </th>
<th rowspan="2"> EX Factory date </th>
</tr>
<tr>
<th width="20%"> Count </th>
<th width="20%"> Quality </th>
</tr>
</thead>
<tr ng-repeat="sryarnorder in sryarnorders | filter: searchtable['count']['count'] | filter: searchtable['quality']['count']">
<td data-title="'S.No'" sortable="'s_no'" filter="{ 's_no': 'text' }">{{$index + 1}}</td>
<td data-title="'Count'" sortable="'count'" filter="{ 'count': 'text' }">
<div style="border-bottom:1px solid #fff;margin-top:13px;" ng-repeat="sryarnorder in sryarnorder.colorshades">{{sryarnorder.count}}
</div>
</td>
<td data-title="'Quality'" sortable="'quality'" filter="{ 'quality': 'text' }">
<div style="border-bottom:1px solid #fff;margin-top:13px;" ng-repeat="sryarnorder in sryarnorder.colorshades">{{sryarnorder.quality}}
</div>
</td>
<td data-title="'Po Delivery Date'" sortable="'po_delivery_date'" filter="{ 'po_delivery_date': 'text' }">{{sryarnorder.po_delivery_date | date:'dd-MM-yyyy'}}</td>
<td data-title="'EX Factory date'" sortable="'ex_factory_date'" filter="{ 'ex_factory_date': 'text' }">{{sryarnorder.ex_factory_date | date:'dd-MM-yyyy'}}</td>
</tr>
</table>
</div>
</body>
</html>