2016-06-28 217 views
1

我想从AngularJS v1.5.8发出HTTP请求,但它不起作用。HTTP请求与angularJS

我有叫我的login()函数简单的HTML表单和一个提交按钮:

<body ng-app="myApp" ng-controller="loginController"> 
...... 
...... 
...... 

<div 
class="col-md-4 col-md-offset-4 col-sm-4 col-sm-offset-3 col-xs-6 col-xs-offset-3"> 
<button type="submit" class="btn btn-default" ng-submit="login()">Submit</button> 
</div> 

这是我loginController

var app = angular.module ("myApp", []); 
app.controller("loginController", function($scope, $http){ 

    $scope.username = ""; 
    $scope.password = ""; 

    $scope.login = function() { 

     $http(
       { 
        method : 'POST', 
        url : SessionService.getserverName()+'/RestServices/services/login/add', 
        headers : { 
         'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8' 
        }, 
        data : { 
         username : $scope.username, 
         password : $scope.password 
        } 
        }).success(function(response, status) { 
        if (response.result.success && status == 200) { 
        $log.info('OK'); 

        $location.path('/newPage.html'); 
      } 
     }) 
    } 
}); 

HTTP请求并没有真正运行。

回答

-2

app.js

'use strict'; 
// Declare app level module which depends on filters, and services 
var app= angular.module('myApp', ['ngRoute','angularUtils.directives.dirPagination','ngLoadingSpinner']); 
app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider.when('/login', {templateUrl: 'partials/login.html', controller: 'loginCtrl'}); 
    $routeProvider.when('/home', {templateUrl: 'partials/home.html', controller: 'homeCtrl'}); 
    $routeProvider.when('/salesnew', {templateUrl: 'partials/salesnew.html', controller: 'salesnewCtrl'}); 
    $routeProvider.when('/salesview', {templateUrl: 'partials/salesview.html', controller: 'salesviewCtrl'}); 
    $routeProvider.when('/users', {templateUrl: 'partials/users.html', controller: 'usersCtrl'}); 
    $routeProvider.when('/forgot', {templateUrl: 'partials/forgot.html', controller: 'forgotCtrl'}); 


    $routeProvider.otherwise({redirectTo: '/login'}); 


}]); 


app.run(function($rootScope, $location, loginService){ 
    var routespermission=['/home']; //route that require login 
    var salesnew=['/salesnew']; 
    var salesview=['/salesview']; 
    var users=['/users']; 
    $rootScope.$on('$routeChangeStart', function(){ 
     if(routespermission.indexOf($location.path()) !=-1 
     || salesview.indexOf($location.path()) !=-1 
     || salesnew.indexOf($location.path()) !=-1 
     || users.indexOf($location.path()) !=-1) 
     { 
      var connected=loginService.islogged(); 
      connected.then(function(msg){ 
       if(!msg.data) 
       { 
        $location.path('/login'); 
       } 

      }); 
     } 
    }); 
}); 

loginServices.js

'use strict'; 
app.factory('loginService',function($http, $location, sessionService){ 
    return{ 
     login:function(data,scope){ 
      var $promise=$http.post('data/user.php',data); //send data to user.php 
      $promise.then(function(msg){ 
       var uid=msg.data; 
       if(uid){ 
        scope.msgtxt='Correct information'; 
        sessionService.set('uid',uid); 
        $location.path('/home'); 
       }   
       else { 
        scope.msgtxt='incorrect information'; 
        $location.path('/login'); 
       }     
      }); 
     }, 
     logout:function(){ 
      sessionService.destroy('uid'); 
      $location.path('/login'); 
     }, 
     islogged:function(){ 
      var $checkSessionServer=$http.post('data/check_session.php'); 
      return $checkSessionServer; 
      /* 
      if(sessionService.get('user')) return true; 
      else return false; 
      */ 
     } 
    } 

}); 

sessionServices.js

'use strict'; 

app.factory('sessionService', ['$http', function($http){ 
    return{ 
     set:function(key,value){ 
      return sessionStorage.setItem(key,value); 
     }, 
     get:function(key){ 
      return sessionStorage.getItem(key); 
     }, 
     destroy:function(key){ 
      $http.post('data/destroy_session.php'); 
      return sessionStorage.removeItem(key); 
     } 
    }; 
}]) 

loginCtrl.js

'use strict'; 

app.controller('loginCtrl', ['$scope','loginService', function ($scope,loginService) { 
    $scope.msgtxt=''; 
    $scope.login=function(data){ 
     loginService.login(data,$scope); //call login service 
    }; 

}]); 
+0

请向OP提供有关出错的信息以及您如何解决问题的信息,以便他们能够从中学习。 –

1

使用以下结构尝试..

$http({ 
    url: 'put url here', 
    method: "put action here just like GET/POST", 
    data: { 'name': 'Rizwan Jamal' } 
}) 
.then(function (resp) { 
    //TODO: put success logic here 
}, 
function (resp) { 
    //TODO: put failed logic here 
} 

);

.then()方法在成功和失败的情况下都会触发。 then()方法接受两个参数成功和一个错误回调,这个回调将被一个响应对象调用。

注: 如果你没有使用表单验证,所以请更改ng-submitng-click ..我希望这个解决方案会为你工作:)

+0

它将是'application/json',但OP要'urlencoded' –