angularJS 의$http:서버 와 의 대화

angularJS 에서 원 격 HTTP 서버 와 대화 할 때 매우 중요 한 서비스-$http 를 사용 합 니 다.

$http 는 angular 의 핵심 서비스 로 브 라 우 저의 xml.httprequest 또는 via JSONP 대상 을 이용 하여 원 격 HTTP 서버 와 상호작용 을 합 니 다

$http 의 사용 방식 은 jquery 가 제공 하 는$.ajax 작업 과 같 으 며,모두 다양한 method 의 요청,get,post,put,delete 등 을 지원 합 니 다

$http 의 다양한 방식 의 요청 이 rest 스타일 에 가 까 워 집 니 다

controller 에서$scope 와 같은 방식 으로$http 대상 을 가 져 올 수 있 습 니 다.예 를 들 어 function controller($scope,$http){}

　　
다음은$http 서비스의 사용 설명 을 진행 합 니 다.다음 과 같이 호출 합 니 다.
　　　

$http(config).success(function(data,status,headers,config){}).error(function(data,status,headers,config){});

config 는 JSON 대상 으로 이 요청 의 url,data,method 등 을 포함 합 니 다.예 를 들 어{url:"login.do",method:"post",data:{name:"12346",pwd:"123"}.

method {String}요청 방식 예:"GET"."POST"

url{String}요청 한 URL 주소

params{key,value}요청 매개 변 수 는 URL 에 연 결 됩 니까?key=value

data{key,value}데 이 터 는 요청 에 넣 어 서버 로 보 냅 니 다

cache{boolean}이 true 라면 http GET 요청 시 기본$http cache 를 사용 합 니 다.그렇지 않 으 면$cache Factory 의 인 스 턴 스 를 사용 합 니 다

timeout{number}설정 시간 초과

2.success 는 요청 성공 후의 리 셋 함수 이 고 error 는 요청 실패 후의 리 셋 함수 입 니 다.여 기 는 주로 되 돌아 오 는 네 개의 매개 변 수 를 설명 합 니 다.
데이터 응답 체
status 상응하는 상태 값

headers 가 getter 의 함 수 를 가 져 옵 니 다

config 요청 중의 config 대상,상기 1 시

　　
여러분 이 HTTP 서버 와 상호작용 하 는 것 을 편리 하 게 하기 위해 angularJS 는 각 요청 방식 의 방법 을 제공 합 니 다.
$http.put/post(url,data,config)url,name 필수,config 선택 가능
　　　　　　$http.get/delete/jsonp/head(url,confid) url 필수,config 선택 가능
url,data,config 는$http 의 인자 와 일치 합 니 다.

다음은$http()및$http.post()를 어떻게 사용 하 는 지 보 여 주 는 simple demo 가 있 습 니 다.
　　

<!DOCTYPE HTML>

<html lang="zh-cn" >

<head>

    <meta charset="UTF-8">

    <title>CSSClasses</title>

    <script src="angular.min.js" type="text/javascript"></script>

<script type="text/javascript">

    function ctrl($http,$scope){

        $scope.login = function(user){

            $http.post("login.do",user).success(function(data, status, headers, config){

                alert("success");

            }).error(function(data, status, headers, config){

                alert("error");

            })

        }

        $scope.login1 = function(user){

            $http({url:"login.do",data:user}).success(function(data, status, headers, config){

                alert("success");

            }).error(function(data, status, headers, config){

                alert("error");

            })

        }

    }

</script>

</head>

<body ng-app>

    <div ng-controller="ctrl">

        <form name="loginFm">

            Name:<input ng-model="user.name" />

            pwd: <input ng-model="user.pwd" />

            <input type="button" value="login" ng-click="login(user)" />

            <input type="button" value="login1" ng-click="login1(user)" />

        </form>

    </div>



</body>

</html>

angularJS 의$http:서버 와 의 대화

좋은 웹페이지 즐겨찾기