AngularJS SQL
前のセクションのコードは、データベースからデータを読み取るために使用することができます。
MySQLからデータを取得するためにPHPを使用して、
AngularJS例
< 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.w3big.com/try/angularjs/data/Customers_MySQL.php")
.success(function (response) {$scope.names = response.records;});
});
< /script >
< 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.w3big.com/try/angularjs/data/Customers_MySQL.php")
.success(function (response) {$scope.names = response.records;});
});
< /script >
»をお試しください
ASP.NETは、データへのSQLアクセスを実行します
AngularJS例
< 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.w3big.com/try/angularjs/data/Customers_SQL.aspx")
.success(function (response) {$scope.names = response.records;});
});
< /script >
< 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.w3big.com/try/angularjs/data/Customers_SQL.aspx")
.success(function (response) {$scope.names = response.records;});
});
< /script >
»をお試しください
サーバー側のコード
以下に記載されているサーバー側のコードのいくつかのタイプをリストします。
- PHPとMySQL。 JSONを返します。
- PHPおよびMS Accessの。 JSONを返します。
- ASP.NET、VB、およびMS Accessを使用。 JSONを返します。
- ASP.NET、カミソリ、およびSQL Liteの使用。 JSONを返します。
クロスドメインのHTTPリクエスト
あなたは異なるサーバー（異なるドメイン）からデータを取得する必要がある場合には、クロスドメインのHTTPリクエストを使用する必要があります。
ページ上のクロスドメインリクエストが非常に一般的です。 多くのページが異なるサーバからCSS、画像、Jsのスクリプトをロードします。
最近のブラウザでは、データを確保するために、すべての要求が厳しく、あなたが別のサイトからデータを呼び出すために必要がある場合は、クロスドメインを介して解決される必要がある、同じドメイン名で制限されています。
ウェブサイトを使用してクロスドメインアクセスを実行するには、次のPHPコード。
ヘッダ（「アクセス制御 - 許可 - 原産地：* "）;
PHP Ajaxのクロスドメインの問題の最善の解決策：詳細クロスドメインアクセスソリューションはで見つけることができます。
1. PHPとMySQLのコード例
<？PHPの
ヘッダ（「アクセス制御 - 許可 - 原産地：* "）;
ヘッダ（ "のContent-Type：アプリケーション/ JSON;のcharset = UTF-8"）;
$コン=新しいmysqliの（「myServerという "、" MYUSER」、「MYPASSWORD」、「ノースウィンド」）。
$結果= $ conn->クエリ（「顧客からの選択仕入、市、国 "）;
$ Outpの= "";
しばらく（$ RS = $その結果生じる> fetch_array（MYSQLI_ASSOC））{
（$ OUTP = "！"）であれば、{、 "$ OUTP =。";}
。$ Outpの= '{ "名前"： "' $ rsの。["得意先名 "] '、;。"'
。$ Outpの= ' "市"： "' $ rsの。["都市 "] '、;。"'
。$ Outpの= ' "国"： "'。$ RS ["国 "]。 '"}';
}
$ Outpの= '{ "レコード"：[' $ Outpの。。 ']}';
$ Conn->クローズ（）;
エコー（$ OUTP）。
？>
ヘッダ（「アクセス制御 - 許可 - 原産地：* "）;
ヘッダ（ "のContent-Type：アプリケーション/ JSON;のcharset = UTF-8"）;
$コン=新しいmysqliの（「myServerという "、" MYUSER」、「MYPASSWORD」、「ノースウィンド」）。
$結果= $ conn->クエリ（「顧客からの選択仕入、市、国 "）;
$ Outpの= "";
しばらく（$ RS = $その結果生じる> fetch_array（MYSQLI_ASSOC））{
（$ OUTP = "！"）であれば、{、 "$ OUTP =。";}
。$ Outpの= '{ "名前"： "' $ rsの。["得意先名 "] '、;。"'
。$ Outpの= ' "市"： "' $ rsの。["都市 "] '、;。"'
。$ Outpの= ' "国"： "'。$ RS ["国 "]。 '"}';
}
$ Outpの= '{ "レコード"：[' $ Outpの。。 ']}';
$ Conn->クローズ（）;
エコー（$ OUTP）。
？>
2. PHPコードの例とMS Accessの
<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=ISO-8859-1");
$conn = new COM("ADODB.Connection");
$conn->open("PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=Northwind.mdb");
$rs = $conn->execute("SELECT CompanyName, City, Country FROM Customers");
$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);
?>
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=ISO-8859-1");
$conn = new COM("ADODB.Connection");
$conn->open("PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=Northwind.mdb");
$rs = $conn->execute("SELECT CompanyName, City, Country FROM Customers");
$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およびMS Accessのコード例
<％@インポート名前空間= "System.IO"％>
<％@インポート名前空間= "System.Dataの"％>
<％@インポート名前空間= "System.Data.OleDbの"％>
<％
Response.AppendHeader（「アクセス制御 - 許可 - 起源 "、" * "）
Response.AppendHeader（「コンテンツタイプ」、「アプリケーション/ JSON」）
OleDbConnectionオブジェクトとして暗いでCONN
OleDbDataAdapterとしてobjAdapter点心
DataTableのようにobjTable点心
DataRowのようobjRow点心
（新しいデータセットとしてobjDataSet点心）
OUTP薄暗いです
薄暗いC
でCONN =新しいOleDbConnectionオブジェクト（ "プロバイダ= Microsoft.Jet.OLEDB.4.0;データソース= Northwind.mdbの"）
objAdapter =新OledbDataAdapter（ "得意先名、市、お客様から国を選択」、CONN）
objAdapter.Fill（objDataSet、 "MYTABLE"）
objTable = objDataSet.Tables（ "mytableは」）
OUTP = ""
C = CHR（34）
objTable.Rows内の各xについて
場合OUTP <> ""その後、OUTP = OUTP＆ "、"
OUTP = OUTP＆ "{"＆C＆ "名前"＆C＆ "："＆C＆X（ "得意先名"）＆C＆ "、"
OUTP = OUTP＆C＆ "市"＆C＆ "："＆C＆X（ "市"）＆C＆ "、"
OUTP = OUTP＆C＆ "国"＆C＆ "："＆C＆X（「カントリー」）＆C＆ "}"
次の
OUTP = "{"＆C＆ "レコード"＆C＆ "：["＆OUTP＆ "]}"
Response.Writeを（OUTP）
conn.close
％>
<％@インポート名前空間= "System.Dataの"％>
<％@インポート名前空間= "System.Data.OleDbの"％>
<％
Response.AppendHeader（「アクセス制御 - 許可 - 起源 "、" * "）
Response.AppendHeader（「コンテンツタイプ」、「アプリケーション/ JSON」）
OleDbConnectionオブジェクトとして暗いでCONN
OleDbDataAdapterとしてobjAdapter点心
DataTableのようにobjTable点心
DataRowのようobjRow点心
（新しいデータセットとしてobjDataSet点心）
OUTP薄暗いです
薄暗いC
でCONN =新しいOleDbConnectionオブジェクト（ "プロバイダ= Microsoft.Jet.OLEDB.4.0;データソース= Northwind.mdbの"）
objAdapter =新OledbDataAdapter（ "得意先名、市、お客様から国を選択」、CONN）
objAdapter.Fill（objDataSet、 "MYTABLE"）
objTable = objDataSet.Tables（ "mytableは」）
OUTP = ""
C = CHR（34）
objTable.Rows内の各xについて
場合OUTP <> ""その後、OUTP = OUTP＆ "、"
OUTP = OUTP＆ "{"＆C＆ "名前"＆C＆ "："＆C＆X（ "得意先名"）＆C＆ "、"
OUTP = OUTP＆C＆ "市"＆C＆ "："＆C＆X（ "市"）＆C＆ "、"
OUTP = OUTP＆C＆ "国"＆C＆ "："＆C＆X（「カントリー」）＆C＆ "}"
次の
OUTP = "{"＆C＆ "レコード"＆C＆ "：["＆OUTP＆ "]}"
Response.Writeを（OUTP）
conn.close
％>
4. ASP.NET、VBカミソリおよびSQL Liteのコード例
@{
Response.AppendHeader("Access-Control-Allow-Origin", "*")
Response.AppendHeader("Content-type", "application/json")
var db = Database.Open("Northwind");
var query = db.Query("SELECT CompanyName, City, Country FROM Customers");
var outp =""
var c = chr(34)
}
@foreach(var row in query)
{
if outp <> "" then outp = 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
Response.AppendHeader("Access-Control-Allow-Origin", "*")
Response.AppendHeader("Content-type", "application/json")
var db = Database.Open("Northwind");
var query = db.Query("SELECT CompanyName, City, Country FROM Customers");
var outp =""
var c = chr(34)
}
@foreach(var row in query)
{
if outp <> "" then outp = 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