AngularJs में दिनांक फ़िल्टर द्वारा अवरोही क्रम

Question

<div class="recent" ng-repeat="reader in
    (filteredItems = (book.reader | orderBy: 'created_at' | limitTo: 1))">
</div>

इसलिए पुस्तक बाकी आपी से आती है और इसमें कई पाठक संलग्न हैं। मैं 'हाल ’का पाठक पाना चाहता हूं।

created_atफ़ील्ड मान जो हाल के रूप में उपयोगकर्ता की पहचान है। लेकिन उपरोक्त कोड मुझे सबसे पुराना पाठक देता है। तो आदेश को उलटने की आवश्यकता है? क्या अवरोही क्रम में छँटाई करने का कोई तरीका है?

Answer 1

प्रलेखन के अनुसार आप reverseतर्क का उपयोग कर सकते हैं ।

filter:orderBy(array, expression[, reverse]);

अपने फ़िल्टर को इसमें बदलें:

orderBy: 'created_at':true

Comments

ध्यान दें कि :यह अल्पविराम नहीं है। (अन्य गैर-चौकस लोगों के लिए)

— रिएक्टिववेन

यदि आप एक सॉर्ट बटन चाहते थे तो आप सॉर्टडायरेक्शन के साथ सच को बदल सकते थे। फिर अपने दायरे में $ गुंजाइश सेट करें। SortDirection = true। क्लिक बटन एनजी-क्लिक = "सॉर्टडायरेक्शन = सॉर्टडायरेक्शन" की तरह दिखेगा

— mbokil

ये केवल उस पृष्ठ के लिए काम कर रहे हैं जिसमें एक ही पृष्ठ में पूर्ण तालिका डेटा है, लेकिन यह पृष्ठांकन के लिए काम नहीं करेगा ..

— ANK

प्रलेखन के लिए लिंक टूट गया है

— रॉबर्ट

Answer 2

आप orderByआरोही के बजाय अवरोही क्रम के लिए तर्क को '-' के साथ उपसर्ग कर सकते हैं । मैं इसे इस तरह लिखूंगा:

<div class="recent" 
   ng-repeat="reader in book.reader | orderBy: '-created_at' | limitTo: 1">
</div>

यह फ़िल्टर ऑर्डर के लिए प्रलेखन में भी कहा गया है ।

Comments

धन्यवाद, यह आदेश को उलटने का एक अच्छा त्वरित और आसान तरीका है।

— ल्यूक

Answer 3

शायद यह किसी के लिए उपयोगी हो सकता है:

मेरे मामले में, मुझे ऑब्जेक्ट्स की एक सरणी मिल रही थी, जिनमें से प्रत्येक में मैंगोज द्वारा निर्धारित तिथि थी।

मैंनें इस्तेमाल किया:

ng-repeat="comment in post.comments | orderBy : sortComment : true"

और फ़ंक्शन को परिभाषित किया:

$scope.sortComment = function(comment) {
    var date = new Date(comment.created);
    return date;
};

इसने मेरे लिए काम किया।

Comments

धन्यवाद। मेरी तारीख के तार एक MMMM dd, YYYY प्रारूप में दर्ज किए गए थे, और मैं यह पता नहीं लगा सका कि उन्हें कोणीय तरीके से कैसे सही ढंग से प्राप्त करने के लिए जब तक कि मैंने एक विधि का उपयोग नहीं किया जो एक दिनांक ऑब्जेक्ट का निर्माण करता है। एक जादू की तरह काम किया।

— जर्गून

यह सही तरीका है .. हम इस विधि को किसी भी तारीख प्रारूप में उपयोग कर सकते हैं .. धन्यवाद बॉस

— जेथिक

Answer 4

और एक कोड उदाहरण:

<div ng-app>
    <div ng-controller="FooController">
        <ul ng-repeat="item in items | orderBy:'num':true">
            <li>{{item.num}} :: {{item.desc}}</li>
        </ul>
    </div>
</div>

और जावास्क्रिप्ट:

function FooController($scope) {
    $scope.items = [
        {desc: 'a', num: 1},
        {desc: 'b', num: 2},
        {desc: 'c', num: 3},
    ];
}

तुम्हे दूंगा:

3 :: c
2 :: b
1 :: a

JSFiddle पर: http://jsfiddle.net/agjqN/

Answer 5

अवरोही क्रमांक तिथि के अनुसार

यह अवरोही क्रम में तारीख के साथ रिकॉर्ड को फ़िल्टर करने में मदद करेगा।

$scope.logData = [
            { event: 'Payment', created_at: '04/05/17 6:47 PM PST' },
            { event: 'Payment', created_at: '04/06/17 12:47 AM PST' },
            { event: 'Payment', created_at: '04/05/17 1:50 PM PST' }
        ]; 

<div ng-repeat="logs in logData | orderBy: '-created_at'" >
      {{logs.event}}
 </div>

Answer 6

मेरे मामले में, ऑर्डरबॉय एक चुनिंदा बॉक्स द्वारा निर्धारित किया जाता है। मैं लुडविग की प्रतिक्रिया को पसंद करता हूं क्योंकि आप चुनिंदा विकल्पों में सॉर्ट दिशा को इस तरह सेट कर सकते हैं:

        $scope.options = [
            { label: 'Title', value: 'title' },
            { label: 'Newest', value: '-publish_date' },
            { label: 'Featured', value: '-featured' }
        ]; 

मार्कअप:

<select ng-model="orderProp" ng-options="opt as opt.label for opt in options"></select>
<ul>
    <li ng-repeat="item in items | orderBy:orderProp.value"></li>
</ul>

Comments

यह कस्टम छँटाई कार्यों के साथ काम नहीं करता है। क्या कस्टम ऑर्डरबाय फ़ंक्शन का उपयोग करते हुए और अपने उदाहरण में <select> से ऑर्डर करने के लिए एक पैरामीटर का चयन करते समय सॉर्ट रिवर्स करने का एक तरीका है?

— cre8value

Answer 7

w3schools नमूने देखें: https://www.w3schools.com/angular/angular_filters.asp https://www.w3schools.com/angular/tryit.asp?filename=try_ng_filters_orderby_click

फिर "रिवर्स" ध्वज जोड़ें:

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<p>Click the table headers to change the sorting order:</p>

<div ng-app="myApp" ng-controller="namesCtrl">

<table border="1" width="100%">
<tr>
<th ng-click="orderByMe('name')">Name</th>
<th ng-click="orderByMe('country')">Country</th>
</tr>
<tr ng-repeat="x in names | orderBy:myOrderBy:reverse">
<td>{{x.name}}</td>
<td>{{x.country}}</td>
</tr>
</table>

</div>

<script>
angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.names = [
        {name:'Jani',country:'Norway'},
        {name:'Carl',country:'Sweden'},
        {name:'Margareth',country:'England'},
        {name:'Hege',country:'Norway'},
        {name:'Joe',country:'Denmark'},
        {name:'Gustav',country:'Sweden'},
        {name:'Birgit',country:'Denmark'},
        {name:'Mary',country:'England'},
        {name:'Kai',country:'Norway'}
        ];

    $scope.reverse=false;
    $scope.orderByMe = function(x) {

        if($scope.myOrderBy == x) {
            $scope.reverse=!$scope.reverse;
        }
        $scope.myOrderBy = x;
    }
});
</script>

</body>
</html>

Answer 8

यदि वे तार मान हैं, तो मेरी सलाह का उपयोग क्षण () तिथियों को प्रबंधित करना आसान है

//controller
$scope.sortBooks = function (reader) {
            var date = moment(reader.endDate, 'DD-MM-YYYY');
            return date;
        };

//template

ng-repeat="reader in book.reader | orderBy : sortBooks : true"

Answer 9

var myApp = angular.module('myApp', []);

myApp.filter("toArray", function () {
    return function (obj) {
        var result = [];
        angular.forEach(obj, function (val, key) {
            result.push(val);
        });
        return result;
    };
});


myApp.controller("mainCtrl", function ($scope) {

  $scope.logData = [
              { event: 'Payment', created_at: '10/10/2019 6:47 PM PST' },
              { event: 'Payment', created_at: '20/10/2019 12:47 AM PST' },
              { event: 'Payment', created_at: '30/10/2019 1:50 PM PST' }
          ]; 
        
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>

<div ng-app="myApp" ng-controller="mainCtrl">

  <h4>Descending</h4>
  <ul>
    <li ng-repeat="logs in logData | toArray | orderBy:'created_at':true" >
          {{logs.event}} - Date : {{logs.created_at}}
    </li>
  </ul>
  
  <br>
  
  
  <h4>Ascending</h4>
  <ul>
    <li ng-repeat="logs in logData | toArray | orderBy:'created_at':false" >
          {{logs.event}} - Date : {{logs.created_at}}
    </li>
  </ul>
  
</div>