एंगुलरजेएस सर्विसेज
AngularJS में आप अपनी स्वयं की सेवा बना सकते हैं, या कई अंतर्निहित सेवाओं में से एक का उपयोग कर सकते हैं।
एक सेवा क्या है?
AngularJS में, एक सेवा एक फ़ंक्शन, या ऑब्जेक्ट है, जो आपके AngularJS एप्लिकेशन के लिए उपलब्ध और सीमित है।
AngularJS में लगभग 30 बिल्ट-इन सेवाएँ हैं। उनमें से एक $location
सेवा है।
सेवा में ऐसे $locationतरीके हैं जो वर्तमान वेब पेज के स्थान के बारे में जानकारी लौटाते हैं:
उदाहरण
$locationनियंत्रक में सेवा का प्रयोग करें :
var app = angular.module('myApp', []);
app.controller('customersCtrl',
function($scope, $location) {
$scope.myUrl = $location.absUrl();
});
ध्यान दें कि $locationसेवा नियंत्रक को तर्क के रूप में पास की जाती है। नियंत्रक में सेवा का उपयोग करने के लिए, इसे एक निर्भरता के रूप में परिभाषित किया जाना चाहिए।
सेवाओं का उपयोग क्यों करें?
कई सेवाओं के लिए, $locationसेवा की तरह, ऐसा लगता है कि आप उन वस्तुओं का उपयोग कर सकते हैं जो पहले से ही DOM में हैं, जैसे window.location
ऑब्जेक्ट, और आप कर सकते हैं, लेकिन इसकी कुछ सीमाएँ होंगी, कम से कम आपके AngularJS एप्लिकेशन के लिए।
AngularJS लगातार आपके एप्लिकेशन की निगरानी करता है, और इसके लिए परिवर्तनों और घटनाओं को ठीक से संभालने के लिए, AngularJS पसंद करता है कि आप ऑब्जेक्ट $location
के बजाय सेवा का उपयोग करें।window.location
$http सेवा
यह $httpसेवा AngularJS अनुप्रयोगों में सबसे अधिक उपयोग की जाने वाली सेवाओं में से एक है। सेवा सर्वर से अनुरोध करती है, और आपके एप्लिकेशन को प्रतिक्रिया को संभालने देती है।
उदाहरण
$httpसर्वर से डेटा का अनुरोध करने के लिए सेवा का उपयोग करें :
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope, $http) {
$http.get("welcome.htm").then(function
(response) {
$scope.myWelcome
= response.data;
});
});
यह उदाहरण सेवा का एक बहुत ही सरल उपयोग दर्शाता है $http। AngularJS Http Tutorial$http में सेवा के बारे में और जानें ।
$टाइमआउट सेवा
सेवा फ़ंक्शन का $timeoutAngularJS संस्करण है
window.setTimeout।
उदाहरण
दो सेकंड के बाद एक नया संदेश प्रदर्शित करें:
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope, $timeout) {
$scope.myHeader = "Hello
World!";
$timeout(function () {
$scope.myHeader = "How are you today?";
}, 2000);
});
$अंतराल सेवा
सेवा फ़ंक्शन का $intervalAngularJS संस्करण है
window.setInterval।
उदाहरण
हर सेकंड समय प्रदर्शित करें:
var app = angular.module('myApp', []);
app.controller('myCtrl',
function($scope, $interval) {
$scope.theTime = new
Date().toLocaleTimeString();
$interval(function () {
$scope.theTime = new Date().toLocaleTimeString();
},
1000);
});
अपनी खुद की सेवा बनाएं
अपनी स्वयं की सेवा बनाने के लिए, अपनी सेवा को मॉड्यूल से कनेक्ट करें:
नाम की एक सेवा बनाएँ hexafy:
app.service('hexafy', function() {
this.myFunc = function (x) {
return x.toString(16);
}
});
अपनी कस्टम मेड सेवा का उपयोग करने के लिए, नियंत्रक को परिभाषित करते समय इसे एक निर्भरता के रूप में जोड़ें:
उदाहरण
hexafyकिसी संख्या को हेक्साडेसिमल संख्या में बदलने के लिए नामित कस्टम मेड सेवा का उपयोग करें :
app.controller('myCtrl', function($scope, hexafy) {
$scope.hex
= hexafy.myFunc(255);
});
फ़िल्टर के अंदर कस्टम सेवा का उपयोग करें
एक बार जब आप एक सेवा बना लेते हैं, और इसे अपने एप्लिकेशन से कनेक्ट कर लेते हैं, तो आप किसी भी नियंत्रक, निर्देश, फ़िल्टर, या अन्य सेवाओं के अंदर भी सेवा का उपयोग कर सकते हैं।
फ़िल्टर के अंदर सेवा का उपयोग करने के लिए, फ़िल्टर को परिभाषित करते समय इसे एक निर्भरता के रूप में जोड़ें:
hexafyफ़िल्टर में उपयोग की जाने वाली सेवा myFormat:
app.filter('myFormat',['hexafy', function(hexafy) {
return function(x) {
return
hexafy.myFunc(x);
};
}]);
किसी ऑब्जेक्ट, या किसी सरणी से मान प्रदर्शित करते समय आप फ़िल्टर का उपयोग कर सकते हैं:
<ul>
<li ng-repeat="x in counts">{{x | myFormat}}</li>
</ul>