Madhu
Madhu

Reputation: 121

Angularjs Express.Js redirect Issue with angular Ajax call

I have a $http pst ajax call from angular js to Express.js api. In Express.js part I ma using async module of node to have some serial execution of code. When no issues I want to redirect to a specific page. Since I am making a ajax call from angular if I use res.render('url') this is not redirecting the page instead its alerting me on angularjs. BTW I have a $routeProvider on angular also :). That is to load partial template after redirect

Code of angular AJAX POST CALL

app.controller('MainCtrl',function($scope,$http){
    $scope.loginForm=function(){
        alert($scope.username);
        $http.post('/login',{'name': $scope.username}).
        success(function(data) {
            alert(data);
        }).
        error(function(data) {
             alert(data);
        });
    }
});

Node.js(Express.js) api to validate and make a redirect

app.post('/login',function(req,res){

var name= req.body.name;
//var password= req.body.password;
async.series([
    function (callback){
        var query= client.query('select count(*) as lgResult from Login where Email='+'"'+req.body.name+'"',function(err,result,field){
            if(err) return callback(err);
            if(result[0]['lgResult'] === 0){
                res.send('passwordWrong');
            }
            if(result[0]['lgResult'] === 1){
                callback(null, 'one');
            }

        });

    },
    function (callback){
        var query= client.query('select count(*) as lgResult from Login where Email='+'"'+req.body.name+'"',function(err,result,field){
            if(err) return callback(err);
            if(result[0]['lgResult'] === 0){
                res.send('passwordWrongSecondtime');
            }
            if(result[0]['lgResult'] === 1){
                 callback(null, 'two');
            }
        });
    }],
    function (err,results){
        if(err) {
            console.log(err);
            res.send('Something Broke sorry');
        }
        else{
            res.render('employelogin/employlogin');
        }
    });

});

Angular Routing :)

app.config(function($routeProvider, $controllerProvider,$compileProvider){
 app.registerCtrl = $controllerProvider.register;
  app.compileProvider    = $compileProvider.directive;
        $routeProvider
        .when('/employeeTimeSheet',{
            controller:'MainCtrl',
            templateUrl:'employeeTimeSheet.html'
        })
        .when('/employeeLogin',{
            templateUrl:'employeeDashboard.html'
        })
        .otherwise({redirectTo:'/employeeLogin'});

});

What is my mistake here

Upvotes: 0

Views: 2301

Answers (1)

Eugene Kostrikov
Eugene Kostrikov

Reputation: 7119

Just do not try to handle everything within one HTTP request.

  1. In Express app use res.send(200, 'ok'); (or something similar) instead of res.render(); This makes Angular run .success() callback.
  2. res.send('Something broke') will trigger Angular's success callback as it sends 200 HTTP code by default, so add error status code to the response. e.g. res.send(500, 'Something broke'); In that case Angular will run .error callback.
  3. In Angular success callback redirect to desired page and let Angular decide which view to request from the server. (hint: $location service is very helpful here http://docs.angularjs.org/guide/dev_guide.services.$location)

In your success callback use

$location.path('/employeeTimeSheet');

This will handle redirect. And don't forget to inject $location service to the controller.

Upvotes: 1

Related Questions