Latest web development tutorials

AngularJS Http

$ Http AngularJS ist ein Kern - Service , um Daten von einem Remote - Server zu lesen.

Lesen Sie JSON-Datei

Das Folgende ist eine JSON-Datei auf einem Web-Server gespeichert:

http://www.w3big.com/try/angularjs/data/sites.php

{ "Sites": [ { "Name": "Tutorial", "URL": "www.w3big.com ", "Land": "CN" }, { "Name": "Google", "URL": "www.google.com", "Land": "USA" }, { "Name": "Facebook", "URL": "www.facebook.com", "Land": "USA" }, { "Name": "Microblogging", "URL": "www.weibo.com ", "Land": "CN" } ] }

AngularJS $ http

AngularJS $ HTTP-Dienst wird verwendet, um Daten auf einem Webserver zu lesen.

$ Http.get (url) Funktion wird verwendet, um den Datenserver zu lesen.

AngularJS Beispiele

<Div ng-app = "myApp" ng-Controller = "siteCtrl"> <Ul> <Li ng-repeat = "x in Namen "> {{x.Name + ',' + x.Country}} </ li> </ Ul> </ Div> <Script> var app = angular.module ( 'myApp', []); app.controller ( 'siteCtrl', function ($ scope, $ http) {$ http.get ( "http://www.w3big.com /try/angularjs/data/sites.php ") .success (function (Antwort ) {$ scope.names = response.sites;});}); </ script>

Versuchen »

Anwendungsanalyse:

Hinweis: erhalten ein Anforderungscode oben ist die Site-Server, können Sie nicht direkt an Ihrem lokalen Lauf kopiert werden, wird es Cross-Domain-Problem ist die Lösung Customers_JSON.php Daten auf Ihrem eigenen Server zu kopieren, mit: PHP Ajax Cross-Domain-Problem die beste Lösung.

AngularJS Anwendung definiert durch ng-App. Anwendungsausführung im <div> in.

ng-Controller Befehlsregler Objektnamen gesetzt.

CustomersController Funktion ist ein Standard - Objektkonstruktor JavaScript.

Das Controller - Objekt hat eine Eigenschaft: $ scope.names.

$ Http.get () liest die statischen JSON - Daten aus dem Web - Server.

Server - Datendatei: http://www.w3big.com/try/angularjs/data/sites.php .

Wenn JSON - Daten vom Server laden, scope.names $ in ein Array.

Note Dieser Code kann auch zum Lesen von Datenbankdaten verwendet werden.