express - AngularJS $resource returns empty object and doesn't update with data -

i have basic get/post api right angularjs , express/node. i'm trying make spa angular can add, get, , delete boards (basically post-it notes web). every time button clicked, fires $scope.addboard, $resource object makes post request.

it fires alright, returns empty object updates html automatically empty data only. if want board populated information, have manual refresh of whole page. tried incorporating call , using promise, can't either option work. there way can html update automatically full data after post request made angular way??

services.js

  krelloapp.factory('boards', ['$resource', function($resource) {    return $resource('api/boards/:id', {}, {     get: {method: 'get', isarray: true},     add: {method: 'post', transformresponse: []}   });  }]); 

controller.js

krelloapp.controller('boardcontroller', ['$scope', '$resource', '$location', '$http', 'boards', function($scope, $resource, $location, $http, boards) {    // boards   $scope.boards = boards.get();    // add board   $scope.addboard = function() {     // boards.add().then(function(response) {     //   $scope.boards.push(response);     // })     // boards.add(function(response) {     //   $scope.boards.push(response)     // });     $scope.boards.push(boards.add());   };  }]); 

api route post:

  app.post('/api/boards', isloggedin, function(req, res) {     // add new board user     // may need more posts add lists , stuff     user.findone({ _id: req.user._id }, function(err, user) {       if (err) {         return res.send(err);       };       newboard = user.generateboard('extra board');       newlist = user.generatelist('extra list');       newcard = user.generatecard('extra card', 'card description');       newlist.cards.push(newcard);       newboard.lists.push(newlist);       user.boards.push(newboard);        user.save(function(err) {         if (err) {           throw err;         };       });        console.log('success post');       console.log('added board user: ' + req.user.local.email);       res.json(req.user.boards)     });   }); 

html:

<div class="row">   <div class="col-xs-12 col-md-3">     <div class="btn btn-success" ng-click="addboard()">       <span class="fa fa-plus-square"></span>     </div>   </div> </div>  <div class="row">   <div class="col-xs-12 col-md-3" ng-repeat="board in boards">     <h1 class="jumbotron">{{ board.title }}</h1>   </div> </div> 

i got picture below too. each board automatically generates 'title' of 'extra board' should show when it's generated. problem title/data shows after manually refresh whole page. when click green button addboard, gives me empty board.

picture 2: odd because shows response contains data, angular isn't populating reason.

final edit (answer):

thanks guys. same problem, changed fix it:

in services.js, remove transformresponse looks add:{method: 'post'}.

in api post route, change bottom line says res.json(req.user.boards) res.json(newboard);

i use second commented out method callback. if use get?

boards.add({}, function(response) {   $scope.boards.push(response) }, function(error){   console.log(error); });