javascript - AngularJS redirection after ng-click - Stack Overflow

admin管理员组

文章数量:1359419

I have a REST API that read/save data from a MongoDB database. The application I use retrieves a form and create an object (a job) from it, then save it to the DB. After the form, I have a button which click event triggers the saving function of my controller, then redirects to another url.

Once I click on the button, I am said that the job has well been added to the DB but the application is jammed and the redirection is never called. However, if I reload my application, I can see that the new "job" has well been added to the DB. What's wrong with this ??? Thanks !

Here is my code:

Sample html(jade) code:

button.btn.btn-large.btn-primary(type='submit', ng:click="save()") Create

Controller of the angular module:

function myJobOfferListCtrl($scope, $location, myJobs) {

    $scope.save = function() {
        var newJob = new myJobs($scope.job);
        newJob.$save(function(err) {
            if(err)
                console.log('Impossible to create new job');
            else {
                console.log('Ready to redirect');
                $location.path('/offers');
            }
        });     
    };    
}

Configuration of the angular module:

var myApp = angular.module('appProfile', ['ngResource']);

myApp.factory('myJobs',['$resource', function($resource) {
    return $resource('/api/allMyPostedJobs',
            {},
            {
                save: {
                    method: 'POST'
                }   
            });
}]);

The routing in my nodejs application :

app.post('/job', pass.ensureAuthenticated, jobOffers_routes.create);

And finally the controller of my REST API:

exports.create = function(req, res) {
    var user = req.user;
    var job = new Job({ user: user, 
                        title: req.body.title,
                        description: req.body.description,
                        salary: req.body.salary,
                        dueDate: new Date(req.body.dueDate),
                        category: req.body.category});
    job.save(function(err) {
        if(err) {
            console.log(err);
            res.redirect('/home');
        } 
        else {
            console.log('New job for user: ' + user.username + " has been posted."); //<--- Message displayed in the log    
            //res.redirect('/offers'); //<---- triggered but never render
            res.send(JSON.stringify(job));
        }
    });
};

I have a REST API that read/save data from a MongoDB database. The application I use retrieves a form and create an object (a job) from it, then save it to the DB. After the form, I have a button which click event triggers the saving function of my controller, then redirects to another url.

Once I click on the button, I am said that the job has well been added to the DB but the application is jammed and the redirection is never called. However, if I reload my application, I can see that the new "job" has well been added to the DB. What's wrong with this ??? Thanks !

Here is my code:

Sample html(jade) code:

button.btn.btn-large.btn-primary(type='submit', ng:click="save()") Create

Controller of the angular module:

function myJobOfferListCtrl($scope, $location, myJobs) {

    $scope.save = function() {
        var newJob = new myJobs($scope.job);
        newJob.$save(function(err) {
            if(err)
                console.log('Impossible to create new job');
            else {
                console.log('Ready to redirect');
                $location.path('/offers');
            }
        });     
    };    
}

Configuration of the angular module:

var myApp = angular.module('appProfile', ['ngResource']);

myApp.factory('myJobs',['$resource', function($resource) {
    return $resource('/api/allMyPostedJobs',
            {},
            {
                save: {
                    method: 'POST'
                }   
            });
}]);

The routing in my nodejs application :

app.post('/job', pass.ensureAuthenticated, jobOffers_routes.create);

And finally the controller of my REST API:

exports.create = function(req, res) {
    var user = req.user;
    var job = new Job({ user: user, 
                        title: req.body.title,
                        description: req.body.description,
                        salary: req.body.salary,
                        dueDate: new Date(req.body.dueDate),
                        category: req.body.category});
    job.save(function(err) {
        if(err) {
            console.log(err);
            res.redirect('/home');
        } 
        else {
            console.log('New job for user: ' + user.username + " has been posted."); //<--- Message displayed in the log    
            //res.redirect('/offers'); //<---- triggered but never render
            res.send(JSON.stringify(job));
        }
    });
};

• javascript
• node.js
• angularjs
• http-redirect
• mongoose

Share Improve this question Follow asked Oct 10, 2013 at 2:53 GuillaumeAGuillaumeA 3,55544 gold badges4141 silver badges7373 bronze badges 3

• Is a POST to the "job" (vs api/allMyPostedJobs) endpoint ever called? If not then I'm not sure how your code even saves anything to the db. – angulord Commented Oct 10, 2013 at 3:40
• Yes, I have this in the log : New job for user XXX has been posted. And furthermore, the post is in the DB when I restart the server application... – GuillaumeA Commented Oct 10, 2013 at 11:11
• Just to clearify, the log doesn't display the message 'Ready to redirect' which may occur just before the redirection by $location.path(). – GuillaumeA Commented Oct 10, 2013 at 14:16

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

I finally found the solution ! The issue was somewhere 18inches behind the screen....

I modified the angular application controller like this :

$scope.save = function() {
        var newJob = new myJobs($scope.job);
        newJob.$save(function(job) {
            if(!job) {
                $log.log('Impossible to create new job');
            }
            else {
                $window.location.href = '/offers';
            }
        });
    };    

The trick is that my REST api returned the created job as a json object, and I was dealing with it like it were an error ! So, each time I created a job object, I was returned a json object, and as it was non null, the log message was triggered and I was never redirected. Furthermore, I now use the $window.location.href property to fully reload the page.

本文标签： javascriptAngularJS redirection after ngclickStack Overflow