جلسه دهم – سرویس های AngularJS

آموزش انگولار جی اس

در AngularJS می توانید خدمات خود را ایجاد کنید ، و یا از بسیاری از خدمات ساخته شده از قبل در انگولار جی اس استفاده کنید.

سرویس چیست؟

در AngularJS یک سرویس، یک تابع یا شی است که برای برنامه AngularJS شما در دسترس بوده و محدود به آن است. AngularJS دارای حدود ۳۰ سرویس ساخته شده دارد . یکی از آنها سرویس های location$ است.

خدمات location$ روش هایی را ارائه می دهد که اطلاعات مربوط به مکان صفحه وب فعلی را باز می گرداند:

مثال : استفاده از سرویس location$ در کنترل :

var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $location) {
$scope.myUrl = $location.absUrl();
});

توجه داشته باشید که سرویس $location به عنوان یک آرگومان به کنترل کننده منتقل می شود. برای استفاده از سرویس در کنترل کننده، باید به عنوان وابستگی تعریف شود.

چرا از سرویس ها استفاده میکنید؟

برای بسیاری از خدمات، مانند سرویس موقعیت $location، به نظر می رسد که شما می توانید از اشیائی که قبلا در DOM مانند object object 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;
});
});

سرویس $timeout
سرویس $timeout نسخه AngularJS از تابع 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?";
}, ۲۰۰۰);
});

سرویس $interval
سرویس $interval ، نسخه AngularJS از تابع 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();
}, ۱۰۰۰);
});

ایجاد سرویس خودتان

برای ایجاد سرویس خود، سرویس خود را به ماژول وصل کنید

یک سرویس به نام 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);
};
}]);

می توانید از فیلتر هنگام نمایش مقادیر از یک شی یا یک آرایه استفاده کنید:

یک سرویس به نام hexafy ایجاد کنید:

<ul>
<li ng-repeat="x in counts">{{x | myFormat}}</li>
</ul>

برچسب ها

, ,

نظرات کاربران


نظرات برای آموزش AngularJS, مقالات فناوری و آموزشی | بدون نظر »

کاربر عزیز، لطفاً دیدگاه ارزشمند خود را از طریق فرم زیر برای ما ارسال کنید:

درباره کدنویسان
آکادمی کدنویسان جهت کمک به دانشجویان رشته های کامپیوتر و فناوری اطلاعات و همه علاقمندان به طراحی و برنامه نویسی برای ویندوز، وب و موبایل ایجاد شده است.
بیشتر آموزش های سایت کدنویسان، بصورت رایگان ارائه شده است و بعضی بسته های آموزشی تصویری و نیز نرم افزارهای پیاده سازی شده در ازای پرداخت، قابل دانلود هستند.
هر گونه نظر، انتقاد یا پیشنهادی در مورد مطالب یا عملکرد کدنویسان دارید، حتما با ما در میان بگذارید.
نمادهای اعتماد ما


تماس با ما
  • شماره همراه : ۰۹۱۵۱۶۰۴۰۶۸
  • آی دی تلگرام : @mmoha94
  • پست الکترونیکی : mohammadi.sm@gmail.com
  • آدرس پستی : بیرجند، خیابان پیروزی، پیروزی ۹، پلاک ۲۸
کلیه حقوق متعلق به سایت کدنویسان است، انتشار و کپی برداری از مطالب این سایت غیرمجاز بوده و پیگرد قانونی دارد.