AngularJS入门教程中SQL实例详解

在前面章节中的代码也可以用于读取数据库中的数据。

使用 PHP 从 MySQL 中获取数据

AngularJS 实例

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="https://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> <style> table, th , td { border: 1px solid grey; border-collapse: collapse; padding: 5px; } table tr:nth-child(odd) { background-color: #f1f1f1; } table tr:nth-child(even) { background-color: #ffffff; } </style> </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_MySQL.php") .success(function (response) {$scope.names = response.records;}); }); </script> </body> </html>

运行结果:

Alfreds Futterkiste   Germany  
Ana Trujillo Emparedados y helados   Mexico  
Antonio Moreno Taquería   Mexico  
Around the Horn   UK  
B's Beverages   UK  
Berglunds snabbköp   Sweden  
Blauer See Delikatessen   Germany  
Blondel père et fils   France  
Bólido Comidas preparadas   Spain  
Bon app'   France  
Bottom-Dollar Marketse   Canada  
Cactus Comidas para llevar   Argentina  
Centro comercial Moctezuma   Mexico  
Chop-suey Chinese   Switzerland  
Comércio Mineiro   Brazil  

ASP.NET 中执行 SQL 获取数据

AngularJS 实例

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="https://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> <style> table, th , td { border: 1px solid grey; border-collapse: collapse; padding: 5px; } table tr:nth-child(odd) { background-color: #f1f1f1; } table tr:nth-child(even) { background-color: #ffffff; } </style> </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("http://www.runoob.com/try/angularjs/data/Customers_SQL.aspx") .success(function (response) {$scope.names = response.records;}); }); </script> </body> </html>

运行结果:

Alfreds Futterkiste   Germany  
Berglunds snabbköp   Sweden  
Centro comercial Moctezuma   Mexico  
Ernst Handel   Austria  
FISSA Fabrica Inter. Salchichas S.A.   Spain  
Galería del gastrónomo   Spain  
Island Trading   UK  
Königlich Essen   Germany  
Laughing Bacchus Wine Cellars   Canada  
Magazzini Alimentari Riuniti   Italy  
North/South   UK  
Paris spécialités   France  
Rattlesnake Canyon Grocery   USA  
Simons bistro   Denmark  
The Big Cheese   USA  
Vaffeljernet   Denmark  
Wolski Zajazd   Poland  

服务端代码

以下列出了列出了几种服务端代码类型:

使用 PHP 和 MySQL。返回 JSON。

使用 PHP 和 MS Access。返回 JSON。

使用 ASP.NET, VB, 及 MS Access。 返回 JSON。

使用 ASP.NET, Razor, 及 SQL Lite。 返回 JSON。

跨域 HTTP 请求

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzxpyg.html