Angular.js が PHP_AngularJS からバックグラウンドデータを読み取る方法-jsチュートリアル-php.cn

Angular.js が PHP_AngularJS からバックグラウンドデータを読み取る方法

WBOY

リリース： 2016-05-16 15:08:19

オリジナル

1475 人が閲覧しました

angular を介してローカルデータを読み取る方法は数多くありました。前の例では、ほとんどの場合、データはモジュールの $scope 変数に保存されるか、初期化されたデータが ng-init を使用して直接定義されます。ただし、これらの方法は他の機能の効果を実証するためだけです。今回はAngular と PHP を組み合わせてバックグラウンドからデータを読み取る方法を学びましょう。
まず、PHP を使用して、一連のバックグラウンドデータを定義しました。コードは次のとおりです (test.php):

<&#63;php 
header("Access-Control-Allow-Origin: *"); 
header("Content-Type: application/json; charset=UTF-8"); 
$conn = new mysqli("myServer", "myUser", "myPassword", "Northwind"); 
$result = $conn->query("SELECT CompanyName, City, Country FROM Customers"); 
$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); 
&#63;>

ログイン後にコピー

このコードの意味は比較的単純です。データベースに接続した後、SQL ステートメントを使用してデータベースから対応するデータを選択します ($conn->query("SELECT CompanyName, City, Country FROM Customers"))。。その後、ループ構造を使用して、取得したデータをキーと値のペアの形式で $outp 変数に保存します。
次にjsで以下のように操作します:

<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("test.php") 
  .success(function (response) {$scope.names = response.records;}); 
}); 
</script>

ログイン後にコピー

ここでも $http サービスがデータの読み取りに使用され、データファイルに対応する URL パスが渡されます。成功すると、データが返され、$scope.names 変数にバインドされます。

以上がこの記事の全内容です。皆様の学習のお役に立てれば幸いです。