ホームページ > 記事 > ウェブフロントエンド > AngularJS 組み込みサービス $http を使用するにはどうすればよいですか? angularjs$httpの使用例
AngularJS 組み込みサービス $http を使用するにはどうすればよいですか? angularjs$httpの使用例
- 寻∝梦オリジナル
- 2018-09-08 14:54:361496ブラウズ
この記事では、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 リモートサービスのデータリクエストを完了するためのデータアクセスモード! 従来の構文構造: 開発者が非同期データリクエストを迅速に処理できるようにするために、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 開発マニュアル にアクセスして学習してください) 簡単な小さなケースを例に挙げて説明しましょう: この記事はここで終わります (さらに詳しく知りたい場合は、PHP 中国語 Web サイト AngularJS ユーザー マニュアル にアクセスして学習してください)。ご質問がある場合は、以下にメッセージを残してください。 $http({
method:”GET”,/* 请求发送方式 */
url:”http://......../com” /* 请求地址*/
}).then( /* then()函数表示请求完成之后的操作 */
function(response) {
/* 请求成功之后的操作函数 */
},
function(response) {
/* 请求失败时候的操作函数 */
}
);
<!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>
シンプルなログイン機能ページ。 皆さんのお役に立てれば幸いです〜
以上がAngularJS 組み込みサービス $http を使用するにはどうすればよいですか? angularjs$httpの使用例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。