title: Displaying Images in Angular.js from MongoDB
body: <p>I recently opened another thread on how to store an image in a mongodb database using node.js/mongoose. (<a href="https://stackoverflow.com/questions/27353346/saving-image-with-mongoose">Saving image with mongoose</a>)</p>
  
  <p>I kinda got it working, but I'm pretty sure that my current way is not the way to go. This may also be why I'm having trouble showing the stored images back on the frontend.</p>
  
  <p>I have 2 questions:</p>
  
  <ol>
  <li>How can I display the image with my current configuration</li>
  <li>Since my code is clearly wrong at this point I'm still wondering whats the way to go to store images with mongoDB. Am I supposed to only store the URL and save the image on my fileserver? Has anyone a working example on how to use <code>GridFS</code> with angular/node/mongoose?</li>
  </ol>
  
  <p>Here's my code for saving the image into my database:</p>
  
  <pre><code>var split = req.body.data.image.dataURL.split('base64,');
  // ... split until I get 'image/png' and the binary of my image
  var avatar = {
    data: data,
    contentType: type
  };
  models.UserImages.create({ avatar: avatar, /* ... */})
  </code></pre>
  
  <p>and my Angular Ctrl for loading the image: </p>
  
  <pre><code>User.findAvatarByUser(data).success(function (data) {
      $scope.avatar = data[0].avatar.data;
  });
  </code></pre>
  
  <p>this shows the logging in chrome incl. the error I get:</p>
  
  <p><img src="https://i.stack.imgur.com/2VDuu.png" alt="enter image description here"></p>
  
  <p>Any help would be much appreciated!</p>
  
  <p><strong>edit:</strong>
  after lostPixels tip I tried saving the image to the FS. After a little bit of trouble I finally got it working. For the moment I'll save the images to my FS until I know how I really want to handle this problem.</p>
  
  <p>if anyone has the same problem, here's how I save my image on the backend (I found it somewhere on stackoverflow, but unfortunately I lost the link to give credit to the right person, sry for that ;) )</p>
  
  <pre><code>fs.writeFile(newImageLocation, data, 'base64', function (err) {
          if (err) throw err
          console.log('File saved.')
      });
  </code></pre>