AnglarJS入門教程の表の実例

アングラルJS表
ng-repeatコマンドはテーブルを完璧に表示することができます。
テーブルにデータを表示する
アングラーを使って表を表示するのはとても簡単です。
AnglarJSの例

 


 

 
{{ x.Name }}
 
{{ x.Country }}
 





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;});
});

実行結果:
Alfreds Ftterkite
Germany
Ana Trujillo Empardados y helados
Mexico
Antonio Moreno Taquer私
Mexico
Aound the Horn
UK
B's Beverages
UK
Berglunds snabractrop
Sweden
Blauer See Delikatessen
Germany
Blondel père et fils
フランシス
B説明lido Commidas preparadas
Spain
Bonアプリ
フランシス
Bottom-Dolar Marketse
Canada
Cactus Coidas para llalvar
Agentina
Centro commerical Moctezuma
Mexico
Chop-suey Chinese
Switzerrland
Conce Mineiro
ブラジル.
 CSSスタイルを使う
ページをより美しくするために、私達はページでCSSを使うことができます。
CSSスタイル

 


 

 
{{ x.Name }}
 
{{ x.Country }}
 





var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
 $http.get("http://www.runoob.com/try/angularjs/data/Customers_JSON.php")
 .success(function (response) {$scope.names = response.records;});
});