AngularJS SPA using API and Mongoose

Question

I am creating a simple AngularJS SPA using an API to load data into Mongoose.

My app just adds, displays and edits a list of members. It works when I just store the members in an array in my factory service but now I want to change it to hook up to Mongoose via an API.

Factory

app.factory('SimpleFactory', ['$http', function($http){

    var factory = {};

    var members =  $http.get('/api/members') 


    factory.getMembers = function () 
    {
        return members = $http.get('/api/members');
    }

   factory.getMember = function (index) {
        if (index >=0 && index < members.length ) {
           return  members[index] = $http.get('/api/members/' + member_id )
       }
       return undefined
    }


    factory.addMember = function(member) {
         return $http.post('/api/members',member)
    }
    factory.updateMember = function(index,member) {
         $http.put('/api/members/' + member_id, member)
    }

    return factory;
}])

Controller

app.controller('MembersController', ['$scope','SimpleFactory',
   function ($scope,SimpleFactory) {


    SimpleFactory.getMembers()
    .success(function(members) {
    $scope.members = members;
    });


$scope.addMember = function()
{
    var member = {
        name: $scope.newMember.name,
        address: $scope.newMember.address,
        age : $scope.newMember.age,
        level : $scope.newMember.level,
        swimmer : $scope.newMember.swimmer,
        email : $scope.newMember.email,
        regdate : $scope.newMember.regdate,
                }

      SimpleFactory.addMember(member)
      .success(function(added_member) 
      { 
         $scope.members.push(added_member);
         $scope.newMember = { }
      }       );
}

}])

But I am not sure how to change my controller for updating a member, it is coded as follows to pick up the members from an array in my factory setting, how do I code it to pick up members from Mongoose via API:

app.controller('MemberDetailController', ['$scope', '$location', '$routeParams', 'SimpleFactory',
    function($scope, $location, $routeParams, SimpleFactory) {

        $scope.member = {
            index: $routeParams.member_index,
            detail: SimpleFactory.getMember($routeParams.member_index)
        }


        $scope.updateMember = function() {
            SimpleFactory.updateMember($scope.member.index,
                $scope.member.detail)
            $location.path('/members')
        }

    }
])

Can anyone help, its not a complicated app but I'm only learning and I am stuck here!

Thanks

Pankaj Parkar · Accepted Answer · 2015-04-25 09:46:07Z

1

You $scope.member object should set after getMember promise success.

Code

SimpleFactory.getMember($routeParams.member_index).then(function(data){
    $scope.member = {  
      index : $routeParams.member_index, 
      detail : data.user
    };
});

Apart from that you need to make sure getMember method should always return a promise while index is 0

   factory.getMember = function (index) {
        var deferred = $q.defer();
        if (index >=0 && index < members.length ) {
           return members[index] = $http.get('/api/members/' + member_id )
       }
       deferred.resolve;
    }

Update

For calling update method you need to do change service first which would return a promise

factory.updateMember = function(index,member) {
     return $http.put('/api/members/' + member_id, member)
}

Then call factory.updateMember resolve that promise and then do $location.path

$scope.updateMember = function() {
    SimpleFactory.updateMember($scope.member.index, $scope.member.detail)
    .then(function(data) {
        $location.path('/members')
    });
};

edited Apr 25, 2015 at 9:46

answered Apr 25, 2015 at 9:28

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

thirty Over a year ago

Thanks pankajpakar, and how do you think this should work to updateMember: ? "$scope.updateMember = function() { SimpleFactory.updateMember($scope.member.index, $scope.member.detail) $location.path('/members') }"

Pankaj Parkar Over a year ago

@thirty take a look at updated answer & do upvote if it does help you, THanks :)

thirty Over a year ago

I have another question pankajparkar but no one has tried to answer yet! Could you have a look if you had a spare minute!

thirty Over a year ago

Thanks here u go stackoverflow.com/questions/29876253/…

Collectives™ on Stack Overflow

AngularJS SPA using API and Mongoose

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related