当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - AngularJS SPA using API and Mongoose

问题描述:

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

网友答案:

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')
    });
};
分享给朋友:
您可能感兴趣的文章:
随机阅读: