ng-repeat 指令可以完美的显示表格。 在表格中显示数据使用 angular 显示表格是非常简单的: AngularJS 实例<!DOCTYPE html><html><head><meta charset="utf-8"><script src="https://cdn.bootcss.com/angular.js/1.6.3/angular.min.js"></script></head><body> <div ng-app="myApp" ng-controller="customersCtrl"> <table> <tr ng-repeat="x in names"> <td>{{ x.Name }}</td> <td>{{ x.Country }}</td> </tr></table> </div> <script>var app = angular.module('myApp', []);app.controller('customersCtrl', function($scope, $http) { $http.get("/try/angularjs/data/Customers_JSON.php") .then(function (result) { $scope.names = result.data.records; });});</script> 废弃声明 (v1.5) v1.5 中$http 的 success 和 error 方法已废弃。使用 then 方法替代。 如果你使用的是 v1.5 以下版本,可以使用以下代码: var app = angular.module('myApp', []);app.controller('customersCtrl', function($scope, $http) { $http.get("/try/angularjs/data/Customers_JSON.php") .success(function (response) {$scope.names = response.records;});});
Customers_JSON.php 文件代码:<?phpecho <<<EOT{"records":[{"Name":"Alfreds Futterkiste","City":"Berlin","Country":"Germany"},{"Name":"Ana Trujillo Emparedados y helados","City":"México D.F.","Country":"Mexico"},{"Name":"Antonio Moreno Taquería","City":"México D.F.","Country":"Mexico"},{"Name":"Around the Horn","City":"London","Country":"UK"},{"Name":"B's Beverages","City":"London","Country":"UK"},{"Name":"Berglunds snabbk 下载地址: AngularJS SQL AngularJS Select(选择框) |