current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 6.7 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote -1 down vote favorite

I get an array through a PHP backend, which shows like below : 

{  
   "response":{  
      "code":"0000",
      "message":"OK"
   },
   "data":[  
      {  
         "id":"2",
         "description":"Description 1",
         "image":"work\/(1)(1).jpg",
         "job_id":"5",
         "final_upload":"N"
      },
      {  
         "id":"4",
         "description":"Description 2",
         "image":"work.jpg",
         "job_id":"5",
         "final_upload":"Y"
      }
   ]
}

On my page i have an ng-repeat list of user ID's , I need to map the user ID to the job_id element in the array that i receive above. So that the image and description related to that job_id will show.

As shown above , there's 2 job_id elements with value "5".

I receive the array above by resolving it as workList.

With the following function i pass in the user_id and map it to the workList array and attempt to retrieve the image and descriptions related to that ID. 

$scope.viewWork = function(id) {
                var uid = id;
                $scope.works = workList.map(item =>
                    ({
                        image: workList.find(work => work.job_id === uid).image,
                        description: workList.find(work => work.job_id === uid).description,
                    }));
            }

The ID posts fine , and then I have an ng-repeat element to display the results...

<tr ng-repeat="works in works">

<td>{{ works.image }}</td>
<td>{{ works.description }}</td>

</tr>

But what i receive is always only the first matching element. The second result is a duplicate of the first. But I do receive 2 results , which is what it should be, But the issue is both of them are the same and not showing the actual second result..

I'm trying to get both matching image and description values for the job_id == 5, But it only returns the first matching element twice....

Thanks for any help .

share|improve this question
1  
Try filtering before your map function instead of inside it... I don't know if that will make a difference, but it is definitely more optimized. worklist.filter((el) => el.job_id === uid).map((item) => ... ) – daniel0mullins yesterday
up vote 3 down vote

The reason is that inside map you are looking for the job_id with find which matches the first result, therefore pushing the same result (the first one) twice to the resulting array, because there are two elements in the original array.

Take a look at the code below. It might shed some light.

var workList = [  
      {  
         "id":"2",
         "description":"Description 1",
         "image":"work\/(1)(1).jpg",
         "job_id":"5",
         "final_upload":"N"
      },
      {  
         "id":"4",
         "description":"Description 2",
         "image":"work.jpg",
         "job_id":"5",
         "final_upload":"Y"
      }
   ];

var viewWork = function(id) {
  var uid = id;
  return workList.map(item => (item.job_id == id ? {
    image: item.image,
    description: item.description,
  } : null));
}

console.log(viewWork(5))

share|improve this answer
up vote 0 down vote

You are looking the item up twice.

  1. map
  2. find inside map (which searches on the full list again every time)

You can simply filter -> map the output to match what you are looking, and return it in the appropriate format. Or you can do a one pass map with a conditional like @JorgeObregon has posted you.

$scope.works = workList
  .filter(item => item.job_id === id)
  .map(item => { image: item.image, description: item.description });
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.