Heim > Web-Frontend > js-Tutorial > Nutzen Sie effizient die integrierten Dienste $http, $location usw. in Angular_AngularJS

Nutzen Sie effizient die integrierten Dienste $http, $location usw. in Angular_AngularJS

WBOY
Freigeben: 2016-05-16 15:09:49
Original
2227 Leute haben es durchsucht

AngularJS stellt uns zahlreiche integrierte Dienste zur Verfügung, mit denen wir einige gängige Funktionen problemlos implementieren können. Im Folgenden finden Sie eine Zusammenfassung der häufig verwendeten integrierten Dienste in Angular.
1.$Standortdienst

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

Hier wird die Variable myUrl für das Objekt $scope definiert und dann wird der Dienst $location verwendet, um die URL-Adresse zu lesen und in myUrl zu speichern.
2..$http-Dienst
$http ist der am häufigsten verwendete Dienst in AngularJS und wird häufig für die Datenübertragung vom Server verwendet. Im folgenden Beispiel sendet der Dienst eine Anfrage an den Server und die Anwendung antwortet mit vom Server gesendeten Daten.

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

3.$timeout()-Dienst und $interval()-Dienst
Die Funktionen dieser beiden Dienste entsprechen den Funktionen setTimeout() und setTimeInterval in JavaScript. Ein einfaches Beispiel für die Aktualisierungszeit in Echtzeit lautet wie folgt:

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

Zusätzlich zu den in Angular bereitgestellten integrierten Diensten können wir auch unsere eigenen Dienste definieren, indem wir service verwenden. Das Folgende ist ein grundlegendes Code-Framework zum Definieren von Diensten:

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

Nachdem wir den Dienst definiert haben, können wir ihn genau wie den integrierten Angular-Dienst verwenden:

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

Das Obige ist eine Zusammenfassung der häufig verwendeten integrierten Dienste in Angular. Ich hoffe, dass es für das Lernen aller hilfreich sein wird.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage