Get specific object by id from array of objects in AngularJS

Question

I have a JSON file containing some data I d like to access on my AngularJS website  Now what I want is to get only one object from the array  So I d like for example Item with id 1   The data looks like this      results                    id   1           name    Test                        id   2           name    Beispiel                        id   3           name    Sample              I d like to load the data with AngularJS  http functionality like this    http get  data SampleData json     which is working  But how can I now get a specific data object  by id  from the array I get from  http get    Thanks in advance for your help   Greets Marc

User · Answer

projectDetailsController controller  ProjectDetailsCtrl   function   scope   routeParams   http         http get  data projects json   success function data              scope projects   data          console log data            for var i   0  i  lt  data length  i               scope project   data i           if  scope project name      routeParams projectName                console log  project-details   scope project           return  scope project                                     Not sure if it s really good  but this was helpful for me    I needed to use  scope to make it work properly

User · Answer

I just want to add something to Willemoes answer  The same code written directly inside the HTML will look like this      FooController results   filter    id  1   0  name      Assuming that  results  is a variable of your FooController and you want to display the  name  property of the filtered item

User · Answer

If you want the list of items like city on the basis of state id then use  var state Id   5  var items     filter  filter   citylist   stateId  state Id

User · Answer

I know I am too late to answer but it s always better to show up rather than not showing up at all     ES6 way to get it    http get  data SampleData json   then response   gt    let id    xyz   let item   response data results find result   gt  result id     id   console log item     your desired item

User · Answer

I would iterate over the results array using an angularjs filter like this   var foundResultObject   getObjectFromResultsList results  1    function getObjectFromResultsList results  resultIdToRetrieve            return  filter  filter   results    id  resultIdToRetrieve    true  0

User · Answer

The only way to do this is to iterate over the array  Obviously if you are sure that the results are ordered by id you can do a binary search

User · Answer

Why complicate the situation  this is simple write some function like this   function findBySpecField data  reqField  value  resField        var container   data      for  var i   0  i  lt  container length  i              if  container i  reqField     value                return container i  resField                        return         Use Case   var data                 id   502100               name    B rd  filiali                                    id   502122              name    10 sayli filiali                                    id   503176              name    5 sayli filiali              console log  Result is    findBySpecField data  id   502100   name       output   Result is B rd  filiali

User · Answer

personally i use underscore for this kind of stuff    so   a     find results function rw   return rw id    2       then  a  would be the row that you wanted of your array where the id was equal to 2

User · Answer

You can use ng-repeat and pick data only if data matches what you are looking for using ng-show for example     lt div ng-repeat  data in res results  ng-show  data id  1  gt         data name     lt  div gt

User · Answer

Using ES6 solution  For those still reading this answer  if you are using ES6 the find method was added in arrays  So assuming the same collection  the solution d be   const foo      results                    id   12           name    Test                        id   2           name    Beispiel                        id   3           name    Sample             foo results find item   gt  item id     2    I d totally go for this solution now  as is less tied to angular or any other framework  Pure Javascript   Angular solution  old solution    I aimed to solve this problem by doing the following    filter  filter   foo results   id  1   0     A use case example   app controller  FooCtrl      filter   function  filter        var foo      results                            id   12               name    Test                                    id   2               name    Beispiel                                    id   3               name    Sample                             We filter the array by id  the result is an array        so we select the element 0      single object    filter  filter   foo results  function  d   return d id     2    0           If you want to see the result  just check the log     console log single object          Plunker  http   plnkr co edit 5E7FYqNNqDuqFBlyDqRh p preview

User · Answer

You can just loop over your array   var doc        your json        function getById arr  id        for  var d   0  len   arr length  d  lt  len  d    1            if  arr d  id     id                return arr d                      var doc id 2   getById doc results  2     If you don t want to write this messy loops  you can consider using underscore js or Lo-Dash  example in the latter    var doc id 2     filter doc results   id  2   0

User · Answer

use  timeout and run a function to search in  results  array  app controller  Search   function   scope   timeout            var foo      results                               id   12                name    Test                                         id   2                name    Beispiel                                         id   3               name    Sample                                    timeout function                  for  var i   0  i  lt  foo results length  i                      if  foo results i  id    2                         scope name   foo results i  name                                             10

User · Answer

For anyone looking at this old post  this is the easiest way to do it currently  It only requires an AngularJS  filter  Its like Willemoes answer  but shorter and easier to understand          quot results quot                            quot id quot   1               quot name quot    quot Test quot                                    quot id quot   2               quot name quot    quot Beispiel quot                                    quot id quot   3               quot name quot    quot Sample quot                      var object by id    filter  filter   foo results   id  2    0      Returns   id  2  name   quot Beispiel quot       WARNING As  mpgn says  this doesn t work properly  This will catch more results  Example  when you search 3 this will catch 23 too

User · Answer

Unfortunately  unless I m mistaken   I think you need to iterate over the results object    for var i   0  i  lt  results length  i    1       var result   results i       if result id     id           return result            At least this way it will break out of the iteration as soon as it finds the correct matching id

User · Answer

scope olkes      id  11   name   ---Z hm t olmasa se  im edin---                      id  15   name   T  rky                       id  45   name   Az rbaycan                      id  60   name   Rusya                      id  64   name   G  rc  stan                      id  65   name   Qazaxistan       lt span gt    olkes   filter   id 45   0  name   lt  span gt    output    Az rbaycan

User · Answer

The simple way to get  one  element from array by id   The find   method returns the value of the first element in the array that satisfies the provided testing function  Otherwise undefined is returned   function isBigEnough element        return element  gt   15     var integers    12  5  8  130  160  44   integers find isBigEnough      130  only one element - first   you don t need to use filter   and catch first element xx filter   0  like in comments above   The same for objects in array  var foo      results            id    1       name     Test            id    2       name     Beispiel            id    3       name     Sample         var secondElement   foo results find function item       return item id    2       var json   JSON stringify secondElement   console log json     Of course if you have multiple id then use filter   method to get all objects  Cheers   x000D   x000D  function isBigEnough element    x000D      return element  gt   15  x000D    x000D   x000D  var integers    12  5  8  130  160  44   x000D  integers find isBigEnough      130  only one element - first x000D   x000D   x000D     x000D   x000D  var foo     x000D   results       x000D       id    1  x000D       name     Test  x000D       x000D       id    2  x000D       name     Beispiel  x000D       x000D       id    3  x000D       name     Sample  x000D    x000D      x000D   x000D  var secondElement   foo results find function item   x000D      return item id    2  x000D      x000D   x000D  var json   JSON stringify secondElement   x000D  console log json   x000D   x000D   x000D

User · Answer

If you can  design your JSON data structure by making use of the array indexes as IDs  You can even  normalize  your JSON arrays as long as you ve no problem making use of the array indexes as  primary key  and  foreign key   something like RDBMS  As such  in future  you can even do something like this   function getParentById childID    var parentObject   parentArray childArray childID  parentID   return parentObject      This is the solution  By Design   For your case  simply   var nameToFind   results idToQuery - 1  name    Of course  if your ID format is something like  XX-0001  of which its array index is 0  then you can either do some string manipulation to map the ID  or else nothing can be done about that except through the iteration approach

[javascript] Get specific object by id from array of objects in AngularJS

Examples related to javascript

Examples related to arrays

Examples related to angularjs

Examples related to json

Examples related to object