Is there a way that I can use a <select> to order rows in AngularJS -
i have rows returned database , displayed on screen:
<tr data-ng-repeat="row in grid.data"> the rows have columns "id", "number", "text" etc.
has examples of how create drop down allow me select of these 3 columns order returned rows by?
this quite simple, try:
html:
<body ng-controller="appctrl"> sort by: <select ng-model="sortfield" ng-options="o.label o in fields"></select> <label> <input type="checkbox" ng-model="inverse"> inverse </label> <hr> <table> <tr data-ng-repeat="row in grid.data|orderby:sortfield.key:inverse"> <td>{{row.id}}</td> <td>{{row.number}}</td> <td>{{row.text}}</td> </tr> </table> </body> js:
app.controller('appctrl', ['$scope', function($scope) { $scope.fields = [ { label: 'id', key: 'id' }, { label: 'nr.', key: 'number' }, { label: 'text', key: 'text' } ]; $scope.sortfield = $scope.fields[2]; $scope.inverse = false; $scope.grid = { data: [ { id: 1, number: 4, text: 'a' }, { id: 2, number: 3, text: 'e' }, { id: 3, number: 2, text: 'b' }, { id: 4, number: 1, text: 'd' }, { id: 5, number: 0, text: 'c' } ] }; }]); 
Comments
Post a Comment