Heim  >  Artikel  >  Web-Frontend  >  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
WBOYOriginal
2016-05-16 15:09:492193Durchsuche

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(); 
}); 

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; 
 }); 
}); 

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); 
}); 

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); 
 } 
}); 

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); 
}); 

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.

Stellungnahme:
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