title: How to access and populate a referenced object schema in a larger document (MERN)
body: <p>Making an app with a variety of schemas, many having other objects (Schema.Types.ObjectIds) as their properties.</p>
  <p>When doing this, I can access the sub-object's property, as long as that sub-object's property is a string. But I'm having issues with it if that sub-object's property is yet another object (and then I need to query properties from that, string or not). For example, the first works fine:</p>
  <p>user schema-&gt; friends property of user (which is a list of user objects) -&gt; username property of friend (which is a string)</p>
  <p>But this I'm having issues with, I'm getting a string id and not the actual object**:</p>
  <p>user schema-&gt; profilePosts property of user (which is a list of profilePost objects) -&gt; author property of profilePost (which is a user object)** -&gt; author username property of profilePost (which is a string)</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var mongoose = require("mongoose");
  var Schema = mongoose.Schema;
  
  var UserSchema = new Schema({
      username: {type: String, required: true},
      password: {type: String, required: true},
      friends: [{type: Schema.Types.ObjectId, ref: "User"}],
      profilePosts: [{type: Schema.Types.ObjectId, ref: "ProfilePost"}],
      friendRequests: [{type: Schema.Types.ObjectId, ref: "User"}], 
  
  })
  
  module.exports = mongoose.model('User', UserSchema);</code></pre>
  </div>
  </div>
  </p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var mongoose = require("mongoose");
  var Schema = mongoose.Schema;
  
  var ProfilePostSchema = new Schema({
      date: {type: Date, required: true},
      author: {type: Schema.Types.ObjectId, ref: "User"},
      content: {type: String, required: true},
      comments: [{type: Schema.Types.ObjectId, ref: "ProfilePostComment"}],
      likes: [{type: Schema.Types.ObjectId, ref: "User"}],
      hostProfile: {type: Schema.Types.ObjectId, required: true,ref: "User"},
  })
  
  module.exports = mongoose.model('ProfilePost', ProfilePostSchema);</code></pre>
  </div>
  </div>
  </p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>exports.user_friends_render = async (req,res) =&gt; {
      try {
          const ViewedProfile = await User.find({}, 'username friends profilePosts friendRequests').populate('friends').populate('profilePosts').populate('friendRequests');
          res.status(200).json(ViewedProfile);
      } catch(error) {
          res.status(200).json({message: error.message});
      }
  }</code></pre>
  </div>
  </div>
  </p>
  <p><a href="https://i.stack.imgur.com/9LStn.png" rel="nofollow noreferrer">objects are string ids instead of objects</a></p>