Javascript 如何使用angularjs动态排序元素
数据如下所示：Javascript 如何使用angularjs动态排序元素,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,数据如下所示： { "createdAt": 1424306663000, "updatedAt": null, "id": 5098, "importSource": null, "importRef": null, "site": "fijiwater", "siteCode": "fijiwater", "bannerImageMobile": { "createdAt": null, "upd
{
"createdAt": 1424306663000,
"updatedAt": null,
"id": 5098,
"importSource": null,
"importRef": null,
"site": "fijiwater",
"siteCode": "fijiwater",
"bannerImageMobile": {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "fijiwater/images/mobile-hero-final.jpg",
"ordinal": 1,
"primary": null,
"meta": null,
"dimension": null
},
"bannerImage": {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "fijiwater/images/extras-bg-final.jpg",
"ordinal": 1,
"primary": null,
"meta": null,
"dimension": null
},
"name": "Extras",
"displayName": "Extras",
"vanityUrl": "extras",
"about": null,
"products": [
{
"createdAt": 1422317527000,
"updatedAt": null,
"id": 1662224,
"importSource": null,
"importRef": null,
"name": "The FIJI Water Straw (6pk)",
"code": null,
"defaultPriceInCents": 995,
"specializedPriceInCents": null,
"msrpInCents": 995,
"subscriptionPrice": 0,
"ordinal": 0,
"tagLine": null,
"mainImage": {
"createdAt": null,
"updatedAt": null,
"id": 178361,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736511908_6pack_straw_image_1.400w.jpg",
"ordinal": 1,
"primary": true,
"meta": [
{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "medium",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736511908_6pack_straw_image_1.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of medium sized image",
"site": null,
"priority": null
},
{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "large",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736511908_6pack_straw_image_1.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of large sized image",
"site": null,
"priority": null
}
],
"dimension": null
},
"vendorSku": null,
"globalSku": null,
"cost": 0,
"maxPrice": 995,
"minPrice": 995
}, {
"createdAt": 1422317651000,
"updatedAt": null,
"id": 1662226,
"importSource": null,
"importRef": null,
"name": "500ML SILVER SLEEVE",
"code": null,
"defaultPriceInCents": 2000,
"specializedPriceInCents": null,
"msrpInCents": 2000,
"subscriptionPrice": 0,
"ordinal": 1,
"tagLine": null,
"mainImage": {
"createdAt": null,
"updatedAt": null,
"id": 178365,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736626348_fiji-silver-sleeve-500ml_400x400.400w.jpg",
"ordinal": 1,
"primary": true,
"meta": [{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "medium",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736626348_fiji-silver-sleeve-500ml_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of medium sized image",
"site": null,
"priority": null
}, {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "large",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736626348_fiji-silver-sleeve-500ml_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of large sized image",
"site": null,
"priority": null
}],
"dimension": null
},
"vendorSku": null,
"globalSku": null,
"cost": 0,
"maxPrice": 2000,
"minPrice": 2000
}, {
"createdAt": 1422317682000,
"updatedAt": null,
"id": 1662227,
"importSource": null,
"importRef": null,
"name": "1.0L SILVER SLEEVE",
"code": null,
"defaultPriceInCents": 3000,
"specializedPriceInCents": null,
"msrpInCents": 3000,
"subscriptionPrice": 0,
"ordinal": 2,
"tagLine": null,
"mainImage": {
"createdAt": null,
"updatedAt": null,
"id": 178364,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736611071_fiji-silver-sleeve-1l_400x400.400w.jpg",
"ordinal": 1,
"primary": true,
"meta": [{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "medium",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736611071_fiji-silver-sleeve-1l_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of medium sized image",
"site": null,
"priority": null
}, {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "large",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736611071_fiji-silver-sleeve-1l_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of large sized image",
"site": null,
"priority": null
}],
"dimension": null
},
"vendorSku": null,
"globalSku": null,
"cost": 0,
"maxPrice": 3000,
"minPrice": 3000
}, {
"createdAt": 1422317711000,
"updatedAt": null,
"id": 1662228,
"importSource": null,
"importRef": null,
"name": "500ML SILVER BAMBOO SLEEVE",
"code": null,
"defaultPriceInCents": 2500,
"specializedPriceInCents": null,
"msrpInCents": 2500,
"subscriptionPrice": 0,
"ordinal": 3,
"tagLine": null,
"mainImage": {
"createdAt": null,
"updatedAt": null,
"id": 178363,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736598667_fiji-silver-sleeve-bamboo-500ml_400x400.400w.jpg",
"ordinal": 1,
"primary": true,
"meta": [{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "medium",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736598667_fiji-silver-sleeve-bamboo-500ml_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of medium sized image",
"site": null,
"priority": null
}, {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "large",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736598667_fiji-silver-sleeve-bamboo-500ml_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of large sized image",
"site": null,
"priority": null
}],
"dimension": null
},
"vendorSku": null,
"globalSku": null,
"cost": 0,
"maxPrice": 2500,
"minPrice": 2500
}, {
"createdAt": 1422317755000,
"updatedAt": null,
"id": 1662229,
"importSource": null,
"importRef": null,
"name": "1.0L SILVER BAMBOO SLEEVE",
"code": null,
"defaultPriceInCents": 3500,
"specializedPriceInCents": null,
"msrpInCents": 3500,
"subscriptionPrice": 0,
"ordinal": 4,
"tagLine": null,
"mainImage": {
"createdAt": null,
"updatedAt": null,
"id": 178362,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736585411_fiji-silver-sleeve-bamboo-1l_400x400.400w.jpg",
"ordinal": 1,
"primary": true,
"meta": [{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "medium",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736585411_fiji-silver-sleeve-bamboo-1l_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of medium sized image",
"site": null,
"priority": null
}, {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "large",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424736585411_fiji-silver-sleeve-bamboo-1l_400x400.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of large sized image",
"site": null,
"priority": null
}],
"dimension": null
},
"vendorSku": null,
"globalSku": null,
"cost": 0,
"maxPrice": 3500,
"minPrice": 3500
}, {
"createdAt": 1422317802000,
"updatedAt": null,
"id": 1662230,
"importSource": null,
"importRef": null,
"name": "FIJI WATER CUFFLINKS",
"code": null,
"defaultPriceInCents": 3000,
"specializedPriceInCents": null,
"msrpInCents": 3000,
"subscriptionPrice": 0,
"ordinal": 5,
"tagLine": null,
"mainImage": {
"createdAt": null,
"updatedAt": null,
"id": 178402,
"importSource": null,
"importRef": null,
"type": "IMAGE",
"ref": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424816861861_FIJI-Cufflinks.400w.jpg",
"ordinal": 1,
"primary": true,
"meta": [{
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "medium",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424816861861_FIJI-Cufflinks.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of medium sized image",
"site": null,
"priority": null
}, {
"createdAt": null,
"updatedAt": null,
"id": null,
"importSource": null,
"importRef": null,
"key": "large",
"value": "//image-cdn.symphonycommerce.com/images/sites/fijiwater/1424816861861_FIJI-Cufflinks.400w.jpg",
"displayValue": null,
"keyType": "IMAGE_SIZE",
"keyDescription": "location of large sized image",
"site": null,
"priority": null
}],
"dimension": null
},
"vendorSku": null,
"globalSku": null,
"cost": 0,
"maxPrice": 3000,
"minPrice": 3000
}],
"removedProducts": [],
"addedProducts": [],
"productCount": 6,
"subCategories": [],
"priority": 17,
"tags": null,
"pageTitle": "Bottled Water Accessories | FIJI Water",
"extraInfo": "Purchase FIJI Water Accessories ranging from Signature Silver Sleeves to FIJI Water Car Cup Holders. Accessorize your FIJI Water today!",
"state": "NON_PUBLISHED",
"parentId": null,
"url": "/extras"
}
angular.module("myApp.products", ['ngRoute'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/products', {
controller: 'ProductsController',
templateUrl: 'products/products.html'
})
.when('/products/:productId', {
controller: 'ProductDetailsController',
templateUrl: 'products/product-details.html'
});
}])
.controller('ProductsController', ['$scope', 'fileInfo', function ($scope, fileInfo) {
$scope.preLink = "http://sneakpeeq-sites.s3.amazonaws.com/";
fileInfo
.success(function (data) {
$scope.data = data;
})
.error(function (data) {
return data;
});
$scope.sortType = 'defaultPriceInCents'; // set the default sort type
$scope.sortReverse = false; // set the default sort order
$scope.searchFish = ''; // set the default search/filter term
}]);
<div id="banner" ng-style="{'background-image': 'url(' + preLink + data.bannerImage.ref + ')'}" style="background-size: 100% 100%; background-repeat: no-repeat; ">
<div id="proLink">
<a href="#productList">Product List</a>
</div>
<div class="bannerText">
<h2>It's slim, trim and ready for the gym.</h2>
<p>Our sleek 700mL bottle fits everywhere. </p>
<p>Cupholders, treadmills, your lifestyle.</p>
</div>
</div>
<a name="productList"></a>
<div id="extras">
<h2>{{data.name}}</h2>
<div id="center">
<div id="products" ng-repeat="p in data.products|orderBy:sortType:sortReverse">
<div id="product">
<p>{{p.defaultPriceInCents/100 | currency}}</p>
<img ng-src="{{p.mainImage.ref}}" alt="">
<h3>{{p.name}}</h3>
</div>
</div>
</div>
</div>
- 价格
- 名字
当有人选择其中一个元素时，我想按升序或降序对元素进行相应的排序。有人能帮忙吗 即使是医生也有这样的例子。很简单。嗨，我找不到。我再看看。谢谢这是一个排序示例。在本例中，您需要从选择框中获取排序谓词，该谓词绑定到某个模型，该模型将在
ng repeat=“friends in friends | orderBy:yourModel”中使用。ng repeat=“friends in friends | orderBy:yourModel”中使用