AngularJS Http
$http ialah perkhidmatan teras dalam AngularJS, digunakan untuk membaca data daripada pelayan jauh.
Baca fail JSON
Berikut ialah fail JSON yang disimpan pada pelayan web:
http://www.php.cn/try/angularjs/data/Customers_JSON.php
"rekod":
[
{
"Nama" : "Alfreds Futterkiste",
"Bandar" : "Berlin",
"Negara" : "Jerman"
},
{
"Nama" : "Berglunds snabbköp",
"Bandar" : "Luleå",
"Negara" : "Sweden"
},
{
"Nama" : "Centro comercial Moctezuma",
"Bandar" : "México D.F.",
"Negara" : "Mexico"
},
{
"Nama" : "Ernst Handel",
" Bandar" : "Graz",
"Negara" : "Austria"
},
{
"Nama" : "FISSA Fabrica Inter. Salchichas S.A.",
"Bandar" : "Madrid",
"Negara" : "Sepanyol"
},
{
"Nama" : "Galería del gastrónomo",
"Bandar" : "Barcelona",
"Negara" : "Sepanyol"
},
{
"Nama" : "Pulau Perdagangan",
"Bandar" : "Cowes",
"Negara" : "UK"
},
{
"Nama" : "Königlich Essen",
"City" : "Brandenburg",
"Negara" : "Jerman"
},
{
"Nama" : "Laughing Bacchus Wine Cellars",
"Bandar" : "Vancouver",
"Negara" : "Kanada"
},
{
"Nama" : "Magazzini Alimentari Riuniti",
"Bandar" : "Bergamo" ,
"Negara" : "Itali"
},
{
"Nama" : "Utara/Selatan",
"Bandar" : "London",
"Negara" : "UK"
},
{
"Nama" : "Paris spécialités",
"Bandar" : "Paris",
"Negara" : "Perancis"
},
{
"Nama" : "Rattlesnake Canyon Grocery",
"City" : "Albuquerque ",
"Negara" : "AS"
},
{
"Nama" : "Simons bistro",
"Bandar" : "København",
"Negara" : "Denmark"
},
{
"Nama" : "The Big Cheese",
"City" : "Portland",
"Negara" : "AS"
},
{
"Nama" : "Vaffeljernet",
"Bandar" : "Århus",
"Negara " : "Denmark"
},
{
"Nama" : "Wolski Zajazd",
"Bandar" : "Warszawa",
"Negara" : "Poland"
}
]
}
AngularJS $http
AngularJS $http ialah perkhidmatan untuk membaca data pada pelayan web.
$http.get(url) ialah fungsi yang digunakan untuk membaca data pelayan.
Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="siteCtrl">
<ul>
<li ng-repeat="x in names">
{{ x.Name + ', ' + x.Country }}
</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('siteCtrl', function($scope, $http) {
$http.get("http://www.runoob.com/try/angularjs/data/sites.php")
.success(function (response) {$scope.names = response.sites;});
});
</script>
</body>
</html>Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Analisis aplikasi:
Nota: Permintaan mendapatkan kod di atas adalah pelayan laman web ini. Anda tidak boleh menyalinnya terus ke run tempatan anda masalah merentas domain. Penyelesaiannya ialah Salin data Customers_JSON.php ke pelayan anda sendiri.
Aplikasi AngularJS ditakrifkan melalui ng-app. Aplikasi dilaksanakan dalam <div>.
ng-controller arahan menetapkan controller Nama objek. Fungsi
customersController ialah JavaScript standard pembina objek.
Objek pengawal mempunyai sifat: $scope.names.
$http.get() Baca statik data JSON daripada pelayan web.
Fail data pelayan ialah: http://www.php.cn/try/angularjs/data/Customers_JSON.php.
Apabila memuatkan data JSON daripada pelayan, $scope.names menjadi tatasusunan.
 | 以上代码也可以用于读取数据库数据。 |
|---|
