AngularJS入门教程中SQL实例详解
AngularJSSQL
在前面章节中的代码也可以用于读取数据库中的数据。
使用PHP从MySQL中获取数据
AngularJS实例
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<scriptsrc="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<style>
table,th,td{
border:1pxsolidgrey;
border-collapse:collapse;
padding:5px;
}
tabletr:nth-child(odd){
background-color:#f1f1f1;
}
tabletr:nth-child(even){
background-color:#ffffff;
}
</style>
</head>
<body>
<divng-app="myApp"ng-controller="customersCtrl">
<table>
<trng-repeat="xinnames">
<td>{{x.Name}}</td>
<td>{{x.Country}}</td>
</tr>
</table>
</div>
<script>
varapp=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>
运行结果：
ASP.NET中执行SQL获取数据
AngularJS实例
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<scriptsrc="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<style>
table,th,td{
border:1pxsolidgrey;
border-collapse:collapse;
padding:5px;
}
tabletr:nth-child(odd){
background-color:#f1f1f1;
}
tabletr:nth-child(even){
background-color:#ffffff;
}
</style>
</head>
<body>
<divng-app="myApp"ng-controller="customersCtrl">
<table>
<trng-repeat="xinnames">
<td>{{x.Name}}</td>
<td>{{x.Country}}</td>
</tr>
</table>
</div>
<script>
varapp=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>
运行结果：
服务端代码
以下列出了列出了几种服务端代码类型：
使用PHP和MySQL。返回JSON。
使用PHP和MSAccess。返回JSON。
使用ASP.NET,VB,及MSAccess。返回JSON。
使用ASP.NET,Razor,及SQLLite。返回JSON。
跨域HTTP请求
如果你需要从不同的服务器（不同域名）上获取数据就需要使用跨域HTTP请求。
跨域请求在网页上非常常见。很多网页从不同服务器上载入CSS,图片，Js脚本等。
在现代浏览器中，为了数据的安全，所有请求被严格限制在同一域名下，如果需要调用不同站点的数据，需要通过跨域来解决。
以下的PHP代码运行使用的网站进行跨域访问。
header("Access-Control-Allow-Origin:*");
更多跨域访问解决方案可参阅：PHPAjax跨域问题最佳解决方案。
1.PHP和MySql代码实例
<?php
header("Access-Control-Allow-Origin:*");
header("Content-Type:application/json;charset=UTF-8");
$conn=newmysqli("myServer","myUser","myPassword","Northwind");
$result=$conn->query("SELECTCompanyName,City,CountryFROMCustomers");
$outp="";
while($rs=$result->fetch_array(MYSQLI_ASSOC)){
if($outp!=""){$outp.=",";}
$outp.='{"Name":"'.$rs["CompanyName"].'",';
$outp.='"City":"'.$rs["City"].'",';
$outp.='"Country":"'.$rs["Country"].'"}';
}
$outp='{"records":['.$outp.']}';
$conn->close();
echo($outp);
?>
2.PHP和MSAccess代码实例
<?php
header("Access-Control-Allow-Origin:*");
header("Content-Type:application/json;charset=ISO-8859-1");
$conn=newCOM("ADODB.Connection");
$conn->open("PROVIDER=Microsoft.Jet.OLEDB.4.0;DataSource=Northwind.mdb");
$rs=$conn->execute("SELECTCompanyName,City,CountryFROMCustomers");
$outp="";
while(!$rs->EOF){
if($outp!=""){$outp.=",";}
$outp.='{"Name":"'.$rs["CompanyName"].'",';
$outp.='"City":"'.$rs["City"].'",';
$outp.='"Country":"'.$rs["Country"].'"}';
$rs->MoveNext();
}
$outp='{"records":['.$outp.']}';
$conn->close();
echo($outp);
?>
3.ASP.NET,VB和MSAccess代码实例
<%@ImportNamespace="System.IO"%>
<%@ImportNamespace="System.Data"%>
<%@ImportNamespace="System.Data.OleDb"%>
<%
Response.AppendHeader("Access-Control-Allow-Origin","*")
Response.AppendHeader("Content-type","application/json")
DimconnAsOleDbConnection
DimobjAdapterAsOleDbDataAdapter
DimobjTableAsDataTable
DimobjRowAsDataRow
DimobjDataSetAsNewDataSet()
Dimoutp
Dimc
conn=NewOledbConnection("Provider=Microsoft.Jet.OLEDB.4.0;datasource=Northwind.mdb")
objAdapter=NewOledbDataAdapter("SELECTCompanyName,City,CountryFROMCustomers",conn)
objAdapter.Fill(objDataSet,"myTable")
objTable=objDataSet.Tables("myTable")
outp=""
c=chr(34)
foreachxinobjTable.Rows
ifoutp<>""thenoutp=outp&","
outp=outp&"{"&c&"Name"&c&":"&c&x("CompanyName")&c&","
outp=outp&c&"City"&c&":"&c&x("City")&c&","
outp=outp&c&"Country"&c&":"&c&x("Country")&c&"}"
next
outp="{"&c&"records"&c&":["&outp&"]}"
response.write(outp)
conn.close
%>
4.ASP.NET,VBRazor和SQLLite代码实例
@{
Response.AppendHeader("Access-Control-Allow-Origin","*")
Response.AppendHeader("Content-type","application/json")
vardb=Database.Open("Northwind");
varquery=db.Query("SELECTCompanyName,City,CountryFROMCustomers");
varoutp=""
varc=chr(34)
}
@foreach(varrowinquery)
{
ifoutp<>""thenoutp=outp+","
outp=outp+"{"+c+"Name"+c+":"+c+@row.CompanyName+c+","
outp=outp+c+"City"+c+":"+c+@row.City+c+","
outp=outp+c+"Country"+c+":"+c+@row.Country+c+"}"
}
outp="{"+c+"records"+c+":["+outp+"]}"
@outp
以上就是AngularJSSQL资料的整理，后续继续补充,希望能帮助学习的朋友。