>웹 프론트엔드 >JS 튜토리얼 >Angular_AngularJS에 내장된 $http, $location 등의 서비스를 효율적으로 활용

Angular_AngularJS에 내장된 $http, $location 등의 서비스를 효율적으로 활용

WBOY
WBOY원래의
2016-05-16 15:09:492249검색

AngularJS는 몇 가지 공통 기능을 쉽게 구현할 수 있는 다양한 내장 서비스를 제공합니다. 다음은 Angular에서 일반적으로 사용되는 내장 서비스를 요약한 것입니다.
1.$위치 서비스

$location服务用于返回当前页面的URL地址,示例代码如下:
var app = angular.module('myApp', []); 
app.controller('customersCtrl', function($scope, $location) { 
 $scope.myUrl = $location.absUrl(); 
}); 

여기에서는 $scope 객체에 대해 myUrl 변수가 정의된 다음 $location 서비스를 사용하여 URL 주소를 읽고 이를 myUrl에 저장합니다.
2..$http 서비스
$http는 AngularJS에서 가장 일반적으로 사용되는 서비스이며, 서버에서 데이터를 전송하는 데 자주 사용됩니다. 아래 예에서 서비스는 서버에 요청을 보내고 애플리케이션은 서버에서 보낸 데이터로 응답합니다.

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope, $http) { 
 $http.get("welcome.htm").then(function (response) { 
  $scope.myWelcome = response.data; 
 }); 
}); 

3.$timeout() 서비스와 $interval() 서비스
이 두 서비스의 기능은 JavaScript의 setTimeout() 및 setTimeInterval 기능에 해당합니다. 간단한 실시간 업데이트 시간 예시는 다음과 같습니다.

app.controller('myCtrl', function($scope, $interval) { 
 $scope.theTime = new Date().toLocaleTimeString(); 
 $interval(function () { 
  $scope.theTime = new Date().toLocaleTimeString(); 
 }, 1000); 
}); 

Angular에서 제공하는 기본 서비스 외에도 service를 사용하여 자체 서비스를 정의할 수도 있습니다. 다음은 서비스 정의를 위한 기본 코드 프레임워크입니다.

app.service('hexafy', function() { 
 this.myFunc = function (x) { 
  return x.toString(16); 
 } 
}); 

서비스를 정의한 후에는 내장된 Angular 서비스처럼 사용할 수 있습니다.

app.controller('myCtrl', function($scope, hexafy) { 
 $scope.hex = hexafy.myFunc(255); 
}); 

위 내용은 Angular에서 일반적으로 사용되는 내장 서비스를 요약한 것입니다. 모든 분들의 학습에 도움이 되기를 바랍니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.