如何对 Angularjs 中的 [Array] 值元素进行排序?
How Can I Sort the [Array] Value Elements in Angularjs?
我在我的应用程序中使用 MEAN 堆栈,AngularJS 作为我的前端。如何过滤计数和质量字段,My Plunker For example:- In the Count drop down list is yarn count , carn count ,burn count
.. if I select the yarn count
that particular transaction only need to display....Please look at my plunker and help us.My Plunker
我应该如何自定义我的 JSON 以使用数组中的数组(或)我应该如何在 ng-repeat
中制作 ng-repeat
以实现上述给定的场景。
我的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.colorshades[0].count for item in sryarnorders" 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.colorshades[0].quality for item in sryarnorders" class="form-control" >
<option value="">All</option>
</select>
</div>
我的数据-ng-模型:-
data-ng-model="searchtable.count"
和
data-ng-model="searchtable.quality"
我的过滤代码:-
filter:searchtable.count.colorshades[0].count
filter:searchtable.quality.colorshades[0].quality
我的数据:-
$scope.sryarnorders = [
{
"_id": "579ef3adba3bac040b583b4f",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 1,
"colorshades": [
{
"_id": "579ef3feba3bac040b583b51",
"quality": "Home Textiles",
"count": "carn count"
},
{
"_id": "579ef3feba3bac040b583b50",
"quality": "Hall Textiles",
"count": "yarn count"
}
],
"created": "2016-08-01T07:01:01.181Z",
"ex_india_date": "2016-08-08",
"supplier_name": "Msd",
"buyer_name": "Mani selvam .R"
},
{
"_id": "5768e6c8bdbc5db509f0f2b2",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 1,
"colorshades": [
{
"_id": "5768e6fcbdbc5db509f0f2b3",
"quality": "Hall Textiles",
"count": "carn count"
}
],
"created": "2016-06-21T07:03:36.504Z",
"ex_india_date": "2016-06-22",
"supplier_name": "Msd",
"buyer_name": "Rohit"
},
{
"_id": "5767cd78f5012d790aa41a7b",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 3,
"colorshades": [
{
"_id": "5767ce37f5012d790aa41a7c",
"quality": "yarn quality",
"count": "burn count"
}
],
"created": "2016-06-20T11:03:20.382Z",
"ex_india_date": "2016-06-21",
"supplier_name": "Mani selvam",
"buyer_name": "ms"
}
我创建了 Plunker 以供参考:- My Plunker
select 模型总是 return 数组中的完整对象,而不是您设置的值。例如,当 select 在您的 plunker 中输入“纱线计数”时,searchtable.count
等于
{"_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"}
鉴于此,有两种解决方案:
1。相应地过滤
这样过滤:
| filter:searchtable.count.colorshades[0].count | filter:searchtable.quality.colorshades[0].quality
看起来不干净。
2。更改选项
您也可以像这样更改 ng-options
:
item.colorshades[0].count as item.colorshades[0].count for item in sryarnorders
这将使 ng-model return 仅 item.colorshades[0].count
。您仍然需要调整过滤器:
| filter:searchtable.count | filter:searchtable.quality
也许可以使它更清洁,我将不得不研究一下。
是的,我终于找到了解决方案,我所做的改变了 ng-module
和 filter
... my Plunker...
我在我的应用程序中使用 MEAN 堆栈,AngularJS 作为我的前端。如何过滤计数和质量字段,My Plunker For example:- In the Count drop down list is yarn count , carn count ,burn count
.. if I select the yarn count
that particular transaction only need to display....Please look at my plunker and help us.My Plunker
我应该如何自定义我的 JSON 以使用数组中的数组(或)我应该如何在 ng-repeat
中制作 ng-repeat
以实现上述给定的场景。
我的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.colorshades[0].count for item in sryarnorders" 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.colorshades[0].quality for item in sryarnorders" class="form-control" >
<option value="">All</option>
</select>
</div>
我的数据-ng-模型:-
data-ng-model="searchtable.count"
和
data-ng-model="searchtable.quality"
我的过滤代码:-
filter:searchtable.count.colorshades[0].count
filter:searchtable.quality.colorshades[0].quality
我的数据:-
$scope.sryarnorders = [
{
"_id": "579ef3adba3bac040b583b4f",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 1,
"colorshades": [
{
"_id": "579ef3feba3bac040b583b51",
"quality": "Home Textiles",
"count": "carn count"
},
{
"_id": "579ef3feba3bac040b583b50",
"quality": "Hall Textiles",
"count": "yarn count"
}
],
"created": "2016-08-01T07:01:01.181Z",
"ex_india_date": "2016-08-08",
"supplier_name": "Msd",
"buyer_name": "Mani selvam .R"
},
{
"_id": "5768e6c8bdbc5db509f0f2b2",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 1,
"colorshades": [
{
"_id": "5768e6fcbdbc5db509f0f2b3",
"quality": "Hall Textiles",
"count": "carn count"
}
],
"created": "2016-06-21T07:03:36.504Z",
"ex_india_date": "2016-06-22",
"supplier_name": "Msd",
"buyer_name": "Rohit"
},
{
"_id": "5767cd78f5012d790aa41a7b",
"user": {
"_id": "57400c32bd07906c1308e2cf",
"displayName": "mani selvam"
},
"__v": 3,
"colorshades": [
{
"_id": "5767ce37f5012d790aa41a7c",
"quality": "yarn quality",
"count": "burn count"
}
],
"created": "2016-06-20T11:03:20.382Z",
"ex_india_date": "2016-06-21",
"supplier_name": "Mani selvam",
"buyer_name": "ms"
}
我创建了 Plunker 以供参考:- My Plunker
select 模型总是 return 数组中的完整对象,而不是您设置的值。例如,当 select 在您的 plunker 中输入“纱线计数”时,searchtable.count
等于
{"_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"}
鉴于此,有两种解决方案:
1。相应地过滤
这样过滤:
| filter:searchtable.count.colorshades[0].count | filter:searchtable.quality.colorshades[0].quality
看起来不干净。
2。更改选项
您也可以像这样更改 ng-options
:
item.colorshades[0].count as item.colorshades[0].count for item in sryarnorders
这将使 ng-model return 仅 item.colorshades[0].count
。您仍然需要调整过滤器:
| filter:searchtable.count | filter:searchtable.quality
也许可以使它更清洁,我将不得不研究一下。
是的,我终于找到了解决方案,我所做的改变了 ng-module
和 filter
... my Plunker...