Maison > Article > interface Web > Comment implémenter l'affichage du parcours des données de collection dans AngularJS
Comment implémenter l'affichage du parcours des données de collection dans AngularJS
- 亚连original
- 2018-06-15 13:58:061662parcourir
Ci-dessous, je vais partager avec vous un exemple de parcours et d'affichage des données de collection AngularJS. Il a une bonne valeur de référence et j'espère qu'il sera utile à tout le monde.
Comme indiqué ci-dessous :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AngularJS集合数据遍历显示</title>
<script type="text/javascript" src="../js/angular.min.js"></script>
</head>
<body ng-app="myapp" ng-controller="myctrl">
<table width="100%" border="1">
<tr>
<td>序号</td>
<td>商品编号</td>
<td>商品名称</td>
<td>价格</td>
</tr>
<tr ng-repeat="product in products">
<td>{{$index+1}}</td>
<td>{{product.id}}</td>
<td>{{product.name}}</td>
<td>{{product.price}}</td>
</tr>
</table>
</body>
<script type="text/javascript">
var myapp = angular.module("myapp",[]);
myapp.controller("myctrl",["$scope",function($scope){
$scope.products = [
{
id:1001,
name:'数码相机',
price:5000
},
{
id:1002,
name:'华为手机',
price:4000
}
];
}])
</script>
</html>Ce qui précède est ce que j'ai compilé pour tout le monde. J'espère qu'il sera utile à tout le monde. avenir.
Articles associés :
Comment implémenter la fonction de directive dans vue
Comment empêcher le rendu répété à l'aide de React
Comment implémenter la fonction de disposition en grille à l'aide de vue
Utilisation associée de js array réduire
Comment utiliser la fonction de remplacement en javascript
Comment utiliser JavaScript pour implémenter la fonction de lecture audio
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!