অ্যাঙ্গুলারজেএসে বর্ণমালা অনুসারে ড্রপডাউন বাছাই করা হচ্ছে

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

ভাঁজটির দিকে তাকানো (বা কৌণিক টুডো টিউটোরিয়ালে একটি বাছাই করা ট্যাগ যুক্ত করা), 'নির্বাচিত' হিসাবে প্রদর্শন করার জন্য একটি বিকল্প পাওয়া - বা এমনকি দেখানোর জন্য প্রথম বিকল্প পাওয়া - এটি একটি বিষয়। কৌনিক দিয়ে এটি ফাঁকা?

— ডেভ এভারিট

@ ডেভএভারিট একটি ডিফল্ট সেট করার একটি উপায় (এবং ফাঁকা আইটেম সরিয়ে ফেলা) এর জন্য একটি বাউন্ড আইটেমটি প্রাক-নির্বাচন করা selected। এই উদাহরণস্বরূপ আপনি যেমন কিছু করতে পারেন $scope.selected = $scope.friends[0]। কাজের নমুনার জন্য এই ঝাঁকুনি দেখুন ।

— গ্লোপি

আমি যদি পুরো জেএসওএন উপাদানকে নয়, নির্বাচিততে মান হিসাবে বয়স চাই?

— ঋষি

@ Ishষি এনজি-বিকল্পগুলির জন্য এটি ব্যবহার করে দেখুন: f.age as f.name for f in friends | orderBy:'name'- এখানে একটি কার্যকরী ফিডল। আরো NG-বিকল্পগুলি এখানে ।

— গ্লোপি

@ গোলাপী, এই উত্তরটি আমাকে সেখানে 90% পথ পেয়েছে আপনি ট্র্যাক দ্বারা ব্যবহৃত হয় জন্য একটি মামলা যোগ করতে আপত্তি হবে? <select ng-model="selected" ng-options="f.name for f in friends | orderBy:'name' track by f.id"></selected>। track byঅর্ডার ফিল্টার লাগানো স্বজ্ঞাত ছিল না এবং এই উত্তরটি গুগলের শীর্ষস্থানীয় অনুসন্ধান ফলাফল।

— মুশিননশিন

Answer 2

আপনি ফিল্টার ব্যবহার করতে সক্ষম হওয়া উচিত: orderBy

orderByreverseপতাকার জন্য একটি তৃতীয় বিকল্প গ্রহণ করতে পারে ।

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

এখানে আইটেমটি বিপরীত ক্রমে 'নাম' সম্পত্তি অনুসারে বাছাই করা হয়। ২ য় আর্গুমেন্ট কোনও অর্ডার ফাংশন হতে পারে, তাই আপনি যে কোনও নিয়মে বাছাই করতে পারেন।

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

Comments

অথবা আইটেমের আইটেমের জন্য কেবল <নির্বাচন এনজি-অপশন = "আইটেম.নাম | অর্ডার বাই: '- নাম'"> </ সিলেক্ট> খুব বেশি কাজ করে :)

— মাহবুব

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

এটি কীভাবে ওপি-র প্রশ্নের উত্তর দেয় এবং / বা আপনি কীভাবে এটি ব্যবহার করবেন তা এখানে একটি বিস্তৃত পাঠ্য very

— শিম দ্য

@ সানথেবিয়ান আমি ইতোমধ্যে ফ্রিডল ডেমো দিয়েছি তাই আমি কোনও ব্যাখ্যা দিয়েছি না।

— টেকনোক্রেট

@ টেকনোক্রেট একটি ব্যাখ্যা যাই হোক না কেন পছন্দনীয় হবে। প্রকৃতপক্ষে, কয়েক বছর আগে পোস্ট হওয়াগুলির চেয়ে কেন এই সমাধানটিকে অগ্রাধিকার দেওয়া হবে তা জানা বিশেষত আকর্ষণীয় হবে। বা, এটি একেবারে কীভাবে আলাদা হয় ...

— চিপোস্কি

পছন্দ করুন এগিয়ে গিয়ে আমি উত্তর সহ ব্যাখ্যা দেওয়ার চেষ্টা করব।

— টেকনোক্র্যাট

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>