কৌণিক ক্ষেত্রে, আমাকে একটি অ্যারেতে অবজেক্টগুলি অনুসন্ধান করতে হবে


114

কৌণিক ক্ষেত্রে, আমার স্কোপে একটি অবজেক্ট রয়েছে যা প্রচুর পরিমাণে অবজেক্ট দেয়। প্রত্যেকের একটি আইডি রয়েছে (এটি একটি ফ্ল্যাট ফাইলে সংরক্ষণ করা হয় যাতে কোনও ডিবি হয় না, এবং আমি মনে করি ব্যবহারকারীর পক্ষে সক্ষম হব না ng-resource)

আমার নিয়ামক:

$scope.fish = [
    {category:'freshwater', id:'1', name: 'trout', more:'false'},
    {category:'freshwater', id:'2', name:'bass', more:'false'}
];

আমার দৃষ্টিতে আমার কাছে ng-showআরও বেশি ডিফল্টরূপে লুকানো মাছ সম্পর্কিত অতিরিক্ত তথ্য রয়েছে তবে আমি যখন সাধারণ শো আরও ট্যাবে ক্লিক করি তখন আমি ফাংশনটি কল করতে চাই showdetails(fish.fish_id)। আমার ফাংশনটি দেখতে এমন কিছু লাগবে:

$scope.showdetails = function(fish_id) {  
    var fish = $scope.fish.get({id: fish_id});
    fish.more = true;
}

এখন ভিউতে আরও বিশদ প্রদর্শিত হয়। তবে ডকুমেন্টেশনের মাধ্যমে অনুসন্ধানের পরে আমি কীভাবে সেই fishঅ্যারেটি অনুসন্ধান করব তা অনুভব করতে পারি না ।

তাহলে আমি কীভাবে অ্যারেটিকে জিজ্ঞাসা করব? এবং কনসোলে কীভাবে আমি ডিবাগারটিকে কল করব যাতে আমার $scopeসাথে খেলতে পারা অবজেক্ট থাকে?

উত্তর:


95

আমি জানি যদি সে আপনাকে কিছুটা সহায়তা করতে পারে।

এখানে আমি আপনার জন্য অনুকরণ করার চেষ্টা করেছি is

জেএসফিডেল চেকআউট করুন;)

http://jsfiddle.net/migontech/gbW8Z/5/

একটি ফিল্টার তৈরি করেছেন যা আপনি 'এনজি-রিপিট'-এ ব্যবহার করতে পারেন

app.filter('getById', function() {
  return function(input, id) {
    var i=0, len=input.length;
    for (; i<len; i++) {
      if (+input[i].id == +id) {
        return input[i];
      }
    }
    return null;
  }
});

নিয়ামক ব্যবহার:

app.controller('SomeController', ['$scope', '$filter', function($scope, $filter) {
     $scope.fish = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}]

     $scope.showdetails = function(fish_id){
         var found = $filter('getById')($scope.fish, fish_id);
         console.log(found);
         $scope.selected = JSON.stringify(found);
     }
}]);

যদি কোনও প্রশ্ন থাকে তবে আমাকে জানান।


আমি কৌণিক এবং জাভাস্ক্রিপ্টে নতুন হিসাবে আমি "+" এর অর্থ পাচ্ছি না যদি (+ ইনপুট [i]। আইডি == + আইডি) statement "বিবৃতি, আপনি দয়া করে আপনার মতামত ভাগ করতে পারেন?
হর্ষবর্ধন

নিখুঁত সমাধান !!
অনিল কুমার রাম 10

1
আমি মনে করি "+ ইনপুট [i] .id == + আইডি" নিশ্চিত করে যে আপনি সংখ্যার তুলনা করছেন। সুতরাং আপনি 1 বা '1' কে $ ফিল্টারে পাস করতে পারেন এবং এটি ঠিক একইভাবে আচরণ করবে। আমি বর্ণানুক্রমিক আইডি ব্যবহার করছি, তাই আমি এটিকে "ইনপুট [i] .id === আইডি" হিসাবে পরিবর্তন করেছি
এক্সেল জেহডেন

211

আপনি বিদ্যমান $ ফিল্টার পরিষেবাটি ব্যবহার করতে পারেন। আমি উপরের ফিডলটি আপডেট করেছি http://jsfiddle.net/gbW8Z/12/

 $scope.showdetails = function(fish_id) {
     var found = $filter('filter')($scope.fish, {id: fish_id}, true);
     if (found.length) {
         $scope.selected = JSON.stringify(found[0]);
     } else {
         $scope.selected = 'Not found';
     }
 }

কৌনিক ডকুমেন্টেশন এখানে http://docs.angularjs.org/api/ng.filter:filter


2
খুব সহায়ক - আমি কৌনিকটি শিখার সাথে সাথে বুঝতে পারি যে আমাকে প্রথমে jQuery ফাংশনগুলি চিন্তা করা বন্ধ করতে হবে (এটি করার জন্য g .গ্রিপ পাওয়ার চেষ্টা করা হয়েছিল) - বরং এই $ ফিল্টার পরিষেবাটি আমার প্রয়োজন হিসাবে কেবল ছিল!
ববি

2
এটি আপনার নিজের ফিল্টার লিখতে জড়িত না হিসাবে ভাল উত্তর।
স্টিভেনউইচ

আপনি কী $scope.selected/ কী রয়েছে তা বিশদ যুক্ত করতে পারেন । একটি দ্রুত-অনুসন্ধানে আমি দেখেছি নির্বাচিত করছেন ng-selected/ ngSelected: If the expression is truthy, then special attribute "selected" will be set on the element । এই কি একই? আপনার উদাহরণে এটি কি করে? ধন্যবাদ
সারফাগল করুন

1
অসাধারণ !. এটি সহজ করে তোলে। ধন্যবাদ
ভরথ

2
আপনার নিয়ামকটিতে $ ফিল্টার পরিষেবা যুক্ত করতে ভুলবেন না। ie: app.controller ('mainController', ['$ ফিল্টার', ফাংশন ($ ফিল্টার) {// {ফিল্টার এখন ব্যবহার করা যেতে পারে}]);
লুকাস রেপ্প ওয়েল্যান্ডার

22

@ মিগনটেকের উত্তরে যুক্ত করার জন্য এবং তাঁর ঠিকানাতে তাঁর মন্তব্যটিও আপনি "সম্ভবত এটি আরও জেনেরিক করতে পারেন", এখানে এটি করার একটি উপায়। নীচে আপনাকে যে কোনও সম্পত্তি দ্বারা অনুসন্ধানের অনুমতি দেবে:

.filter('getByProperty', function() {
    return function(propertyName, propertyValue, collection) {
        var i=0, len=collection.length;
        for (; i<len; i++) {
            if (collection[i][propertyName] == +propertyValue) {
                return collection[i];
            }
        }
        return null;
    }
});

ফিল্টার করার জন্য কলটি তখন হয়ে যাবে:

var found = $filter('getByProperty')('id', fish_id, $scope.fish);

দ্রষ্টব্য, আমি স্ট্রিং-ভিত্তিক ম্যাচগুলির জন্য অনুমতি দেওয়ার জন্য অ্যানারি (+) অপারেটরটি সরিয়েছি ...


ডকুমেন্টেশন বিবেচনা করে বলা হয়েছে যে এটি এনজি-থ্রের জন্য একমাত্র ব্যবহারের কেস, আমি অবশ্যই বলব এটি এটি করার কৌনিক উপায় way
ব্লুহল্লু

উদাহরণটি বুঝতে খুব সহজ এবং খুব সহায়ক
রেনাব্বা

13

একটি নোংরা এবং সহজ সমাধান এর মত দেখতে পারে

$scope.showdetails = function(fish_id) {
    angular.forEach($scope.fish, function(fish, key) {
        fish.more = fish.id == fish_id;
    });
};

5
কেন এটি একটি নোংরা সমাধান?
ট্রায়ালকোডার

5
আমার অনুমানটি হবে কারণ এখানে বিলিয়ন ফিশ রেকর্ড থাকতে পারে এবং আমরা তাদের মাধ্যমে একে একে একে লুপ করছি
RedactedProfile

6
অন্যান্য ভাষায় আরও রেকর্ড থাকতে হবে। মানে, সি ++ এ প্রচুর পরিমাণে মাছ রয়েছে। (ওহ চুপ কর! আমি গিয়ে ভোট দিয়ে যাব .. !!)
মাইক গ্লেডহিল


7

আপনার সমাধানগুলি সঠিক তবে অপ্রয়োজনীয় জটিল। আপনি খাঁটি জাভাস্ক্রিপ্ট ফিল্টার ফাংশন ব্যবহার করতে পারেন । এটি আপনার মডেল:

     $scope.fishes = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}];

এবং এটি আপনার ফাংশন:

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter({id : fish_id});
         return found;
     };

আপনি এক্সপ্রেশনও ব্যবহার করতে পারেন:

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter(function(fish){ return fish.id === fish_id });
         return found;
     };

এই ফাংশন সম্পর্কে আরও: লিঙ্ক


4

এই থ্রেডটি দেখেছি কিন্তু আমি আইডিগুলি অনুসন্ধান করতে চেয়েছিলাম যা আমার সন্ধানের সাথে মেলে না। এটি করার কোড:

found = $filter('filter')($scope.fish, {id: '!fish_id'}, false);

এটি আমার পক্ষে কাজ করেছে। সহজ, চতুর, পরীক্ষা করা সহজ। ধন্যবাদ!
কল্পনা পঞ্চাল
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.