AngularJS में वर्णानुक्रम में गिरावट को क्रमबद्ध करना

Question

मैं एनजी-विकल्प के उपयोग के माध्यम से एक ड्रॉपडाउन को पॉप्युलेट कर रहा हूं जो एक नियंत्रक को झुका हुआ है जो बदले में एक सेवा को बुला रहा है। दुर्भाग्य से आने वाला डेटा एक गड़बड़ है और मुझे इसे वर्णानुक्रम में क्रमबद्ध करने में सक्षम होने की आवश्यकता है।

आप जानते हैं कि ऐसा कुछ $.sortByहोगा लेकिन दुर्भाग्य से यह जैक नहीं करता था। मुझे पता है कि मैं इसे एक हेल्पर विधि function asc(a,b)या कुछ इस तरह से जावास्क्रिप्ट के माध्यम से सॉर्ट कर सकता हूं , लेकिन मैं यह मानने से इंकार करता हूं कि ऐसा करने का कोई क्लीनर तरीका नहीं है, मैं हेल्पर विधियों के साथ नियंत्रक को ब्लोट नहीं करना चाहता। यह सिद्धांत में कुछ इतना बुनियादी है इसलिए मुझे समझ नहीं आता कि AngularJS के पास ऐसा क्यों नहीं है।

क्या कुछ करने का एक तरीका है $orderBy('asc')?

उदाहरण:

<select ng-option="items in item.$orderBy('asc')"></select>

यह विकल्प बहुत उपयोगी होगा orderByताकि आप जो चाहें कर सकते हैं, जब भी आप आमतौर पर डेटा को सॉर्ट करने की कोशिश करते हैं।

Answer 1

कोणीय में एक ऑर्डरबाय फिल्टर होता है जिसे इस तरह इस्तेमाल किया जा सकता है:

<select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name'"></select>

एक उदाहरण के लिए इस पहेली को देखें ।

यह ध्यान देने योग्य है कि यदि track byइसका उपयोग किया जा रहा है तो इसे orderByफिल्टर के बाद दिखाई देना चाहिए , जैसे:

<select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name' track by f.id"></select>

Comments

फ़िडेल को देखते हुए (या कोणीय टूडू ट्यूटोरियल के लिए एक प्रकार का चयन टैग जोड़ना), 'चयनित' के रूप में दिखाने का विकल्प प्राप्त करना - या यहां तक ​​कि दिखाने के लिए पहला विकल्प प्राप्त करना - एक मुद्दा है। कोणीय के साथ यह रिक्त है?

— डेव एवरिट

@DaveEveritt डिफ़ॉल्ट सेट करने का एक तरीका है (और खाली आइटम हटाने के लिए) एक पूर्व आइटम के लिए पूर्व-चयन करना है selected। इस उदाहरण के लिए आप कुछ ऐसा कर सकते हैं $scope.selected = $scope.friends[0]। एक काम कर रहे नमूने के लिए इस बेला को देखें ।

— ग्लॉपी

क्या होगा अगर मैं चयनित मान के रूप में उम्र चाहता हूं, संपूर्ण JSON तत्व नहीं?

— ऋषि

@ ऋषि ने एनजी-ऑप्शन्स के लिए यह कोशिश की: f.age as f.name for f in friends | orderBy:'name'- यहाँ एक वर्किंग फील है । अधिक एनजी-विकल्पों पर यहाँ ।

— ग्लॉसी

@ ग्लॉपी, इस जवाब से मुझे 90% रास्ते मिल गए। जब ट्रैक का उपयोग किया जाता है तो क्या आप एक मामला जोड़ना चाहेंगे? <select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name' track by f.id"></selected>। track byऑर्डर फिल्टर के बाद लगाना सहज नहीं था और यह उत्तर Google का शीर्ष खोज परिणाम है।

— मुशीनोझिन

Answer 2

आपको फ़िल्टर का उपयोग करने में सक्षम होना चाहिए: orderBy

orderByreverseध्वज के लिए तीसरा विकल्प स्वीकार कर सकता है ।

<select ng-option="item.name for item in items | orderBy:'name':true"></select>

यहां आइटम को उल्टे क्रम में 'नाम' संपत्ति द्वारा सॉर्ट किया जाता है। 2 तर्क कोई भी आदेश कार्य हो सकता है, इसलिए आप किसी भी नियम में हल कर सकते हैं।

@ वे http://docs.angularjs.org/api/ng.filter:orderBy

Comments

या बस <select ng-option = "item.name आइटम में आइटम के लिए। ऑर्डर करें: '- नाम'"> </ चयन> वर्क्स भी :):

— महबूब

Answer 3

var module = angular.module("example", []);

module.controller("orderByController", function ($scope) {
    $scope.orderByValue = function (value) {
        return value;
    };

    $scope.items = ["c", "b", "a"];
    $scope.objList = [
        {
            "name": "c"
        }, {
            "name": "b"
        }, {
            "name": "a"
        }];
        $scope.item = "b";
    });

http://jsfiddle.net/Nfv42/65/

Comments

पाठ का एक छोटा सा विवरण यह बताता है कि यह ओपी के प्रश्न का उत्तर कैसे देता है और / या आप इसका उपयोग कैसे करेंगे यह यहां बहुत उपयोगी होगा।

— बीन

@SeantheBean मैंने पहले ही फिडल डेमो दिया है इसलिए मैंने स्पष्टीकरण नहीं दिया है।

— टेक्नोक्रैट

@TechnoCrat एक स्पष्टीकरण वैसे भी बेहतर होगा। वास्तव में, यह जानना विशेष रूप से दिलचस्प होगा कि यह समाधान वर्षों पहले पोस्ट किए गए लोगों पर क्यों पसंद किया जाएगा। या, यह बिल्कुल अलग कैसे होता है ...

— चिपोवस्की

@Chipowski ठीक है। आगे जाकर मैं उत्तर के साथ स्पष्टीकरण देने की कोशिश करूंगा।

— टेक्नोक्रैट

Answer 4

जो कोई भी वैरिएबल को तीसरी लेयर में सॉर्ट करना चाहता है:

<select ng-option="friend.pet.name for friend in friends"></select>

आप इसे इस तरह से कर सकते हैं

<select ng-option="friend.pet.name for friend in friends | orderBy: 'pet.name'"></select>