Displaying Images In Angular.js From MongoDB

I recently opened another thread on how to store an image in a mongodb database using node.js/mongoose. (Saving image with mongoose) I kinda got it working, but I'm pretty sure tha

Solution 1:

Try to do this:

Saving the image in Node

ImageController.create({image: new Buffer(req.body.image, "base64")}, 
  function(err, img) {
      if(err) { return handleError(res, err); }
      return res.status(201).json(img);
  }
);

Loading and decode in Node

  ImageController.findById(req.params.id, function (err, img) {
    if(err) { return handleError(res, err); }
    if(!foto) { return res.send(404); }
    return res.json(img.toString('base64'));
  });

Angular Contoller

$http.get('/api/images/'+$scope.image._id).
  then(function (response) {
    $scope.imgSrc = response.data;
  }, function (response) {
  });

Angular view

<img ng-src="data:image/jpg;base64,{{imgSrc}}">

Solution 2:

Angular view :

[ngStyle]="{'background-image': 'url(' + 'data:image/gif;base64,' +page.Data + ')'}"

The page.Date is a field(image) in a mongodb:

page.Data : fs.readFileSync(meGifFile, {encoding: 'base64'}),