AngularJS 組み込みサービス $http を使用するにはどうすればよいですか? angularjs$httpの使用例-jsチュートリアル-php.cn

AngularJS 組み込みサービス $http を使用するにはどうすればよいですか? angularjs$httpの使用例

寻∝梦

リリース： 2018-09-08 14:54:36

オリジナル

1518 人が閲覧しました

この記事では、angularjsの組み込みサービス$httpについて詳しく紹介します。 angularjs の $http の構文、その使用方法、および完全なコードは記事にあります。今すぐこの記事を見てみましょう

AngularJS 組み込みサービス $http

AngularJS は、多数の組み込みサービスを提供しますこれらの組み込みサービスを通じて、迅速に実行できます。一部のビジネス関数プロセスは、次のように自動的に処理されます。

$window: は、 window オブジェクト をネイティブ

に挿入するために使用されます。 JS

$document: documentdocumentオブジェクトを挿入するために使用されます$timeout:

カプセル化されたネイティブJSにを挿入するために使用されます setTimeout() 関数処理$interval:

は、カプセル化されたネイティブJSにsetInterval()setInterval()を注入するために使用されます。

$location: は、locationオブジェクトをネイティブJSに挿入するために使用されます。これは、URLアドレスやその他の操作

に便利です
$ http：カプセル化されたAjaxオペレーションを注入して、非同期データリクエストなどを実行するために使用します

今日はAngularJSの組み込みサービスの $httpを中心に説明します。

$http:

$httpサービスは、AngularJSのコアサービスの1つであり、主にXMLHttpRequestをカプセル化します。オブジェクトとJSONP リモートサービスのデータリクエストを完了するためのデータアクセスモード!

従来の構文構造:

$http({ method:”GET”,/* 请求发送方式 */ url:”http://......../com” /* 请求地址*/ }).then( /* then()函数表示请求完成之后的操作 */ function(response) { /* 请求成功之后的操作函数 */ 　　}, 　　function(response) { 　　 /* 请求失败时候的操作函数 */ 　　} );
ログイン後にコピー

開発者が非同期データリクエストを迅速に処理できるようにするために、AngularJS は開発を容易にする一連のショートカット関数を提供します。これには主に次の関数が含まれます:

l $http.get( )

l $http.post()

l $http.jsonp()

l $http.header()

l $http.patch()

l $http .put()

l $http.delete()

$http.get(“url”).then(fn1, fn2);

実際、ショートカットは単純なカプセル化です $ http サービスでは、通常のプロジェクト開発中に、元の組み込みサービス $http の $http({}).then(fn1, fn2) 関数が主に非同期データ処理に使用されます。 (さらに詳しく知りたい場合は、PHP 中国語 Web サイトAngularJS 開発マニュアルにアクセスして学習してください)

簡単な小さなケースを例に挙げて説明しましょう:

<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="js/lib/AngularJS/angular.min.js"></script> </head> <body> <p class="form" ng-controller="login"> 账号：<input type="text" ng-model="username"><br /> 密码：<input type="text" ng-model="password"><br /> <button ng-click="loginFn()">登录</button> </p> <script> var app = angular.module("myApp", []); app.controller("login", ["$scope", "$http", function($scope, $http) { $scope.loginFn = function() { // 实现登录 $http({ method:"GET", url:"服务器地址", params:{status:"login",userID:$scope.username, password:$scope.password} /* 如果是get请求，请使用params来传递参数如果是Post请求，请使用data来尝试传递参数 */ }).then( function success(resp) { console.log("请求成功", resp); if(resp.data) { console.log("登录成功，跳转到首页"); } else { console.log("登录失败"); } }, function error(resp){ console.log("请求失败"); } ); } }]); </script> </body> </html>
ログイン後にコピー

シンプルなログイン機能ページ。皆さんのお役に立てれば幸いです〜

この記事はここで終わります (さらに詳しく知りたい場合は、PHP 中国語 Web サイト AngularJS ユーザーマニュアルにアクセスして学習してください)。ご質問がある場合は、以下にメッセージを残してください。

以上がAngularJS 組み込みサービス $http を使用するにはどうすればよいですか? angularjs$httpの使用例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。