آانگولار جی ایس سروس

در 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 للإطلاع على المزيد من المعلومات حول خدمة $http في دروس AngularJS Http.

استخدام $timeout بشكل بسيط.

$timeout خدمة هي إصدار AngularJS من window.setTimeout الوظيفة.

مثال

إظهار رسالة جديدة بعد دقيقتين:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $timeout) {
  $scope.myHeader = "مرحبًا بالعالم!";
  $timeout(function () {
    $scope.myHeader = "كيف حالك اليوم؟";
  }, 2000);
});

آپ خود سجیو

خدمة $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();
  }, 1000);
});

آپ خود سجیو

إنشاء خدمتك الخاصة

لإنشاء خدمة خاصة بك، قم بوصلة الخدمة مع المodule:

إنشاء اسم: 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);
});

آپ خود سجیو

فیلٹر میں ذاتی سروس استعمال کیا جانا

سروس کو بنایا اور اس کو اپنے ایپلی کیشن سے جوڑنے کے بعد، آپ کو کسی بھی کنٹرولر، انویٹیو، فیلٹر یا سروس میں اس سروس کو استعمال کیاجاسکتا ہے۔

سروس کو فیلٹر میں استعمال کرنے کیلئے، اس کو تعریف کے وقت کی جانے والی وابستگیوں میں شامل کریں:

فیلٹر میں استعمال کی جانے والی سروس ہیکسافائی:

app.filter('myFormat',['hexafy', function(hexafy) {
  return function(x) {
    return hexafy.myFunc(x);
  };
});

آپ خود سجیو

آپ کو اس فیلٹر کو استعمال کرکے نمائش کی جگہ یا شماروں میں کی جاسکتی ہے:

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

آپ خود سجیو