Join the Stack Overflow Community
Stack Overflow is a community of 6.4 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up

I've got 2 data sets

posts

[
 {
  "postId": 1,
  "postContent": "Lorem Ipsum",
  "user": 1
 },
 {
  "postId": 2,
  "postContent": "Lorem Ipsum",
  "user": 2
 },
]

and users

[
 {
  "user": 1,
  "firstName": "John",
  "lastName": "Doe"
 },
 {
  "user": 2,
  "firstName": "Johny",
  "lastName": "Doey"
 }
]

I am repeating all the posts and i would like to access a user data throught the $scope.post.user.firstName etc.

how should i aproach it?

share|improve this question
    
What have you tryed thus far? – Mathieu de Lorimier 21 hours ago
    
What is your desire output? – Masood Rehman 21 hours ago
    
There is a little typo in the users data set btw – Aks 21 hours ago
    
@MathieudeLorimier i am using $resource directive and i've tried to do something like $scope.post.user = user.get({id: $post.user}) also i have found out about .merge() and .extend() functions via google search, but i've decided to ask before implementig one of them – EDGECRUSHER 21 hours ago
    
@MasoodRehman to access user data in a way that is like accessing nested json – EDGECRUSHER 21 hours ago
up vote 1 down vote accepted

You can implement a method like getUserById() with the use of Array.prototype.find() to use it when iterating over your posts.

Code in AngularJS:

angular
  .module('App', [])
  .controller('AppController', ['$scope', function ($scope) {
    $scope.posts = [{"postId": 1,"postContent": "Lorem Ipsum","user": 1},{"postId": 2,"postContent": "Lorem Ipsum","user": 2}];
    $scope.users = [{"user": 1,  "firstName": "John",  "lastName": "Doe"},{  "user": 2,  "firstName": "Johny",  "lastName": "Doey"}];

    $scope.getUserById = function (id) {
      return $scope.users.find(function (user) {
        return id === user.user;
      });
    };
  }]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.9/angular.min.js"></script>

<div ng-app="App" ng-controller="AppController" class="row">
  <div ng-repeat="p in posts">
    <p>{{p.postContent}} <i>by {{getUserById(p.user).firstName}}</i></p>
  </div>
</div>

share|improve this answer

find() the matching user for each post.

Note that if you are not using ES6 features, you will need a polyfill for Object.assign() and should use regular function() {}s instead array functions.

var posts = [{"postId":1,"postContent":"LoremIpsum","user":1},{"postId":2,"postContent":"LoremIpsum","user":2}];
var users = [{"user":1,"firstName":"John","lastName":"Doe"},{"user":2,"firstName":"Johny","lastName":"Doey"}];

var out = posts.map(post => Object.assign({}, post, {
  user: users.find(user => user.user === post.user)
}));
                
console.log(out);

share|improve this answer

You can create a function that maps each user object to your post object. Then you can access user details as $scope.post.user.first_name; Here is simple code that will make you an new object with users.

var new_object = [];
function mapUsersToPosts(users, posts){
   angular.forEach(posts, function(post){
      angular.forEach(users, function(user){
         if(post.user_id == user.user_id){
            new_object.push({
                'post' : post,
                'user' : user
            });
         }
      });
   });
}

Now you can loop new_object and use user data and post data in same object.

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.