Directives 5

by bestmomo

HTML

<div ng-app>
	 <div ng-init="articles = [
		{nom:'Farine', prix:2.3},
		{nom:'Sucre', prix:1.35},
		{nom:'Gâteaux', prix:3.9},
		{nom:'Huile', prix:5.25}
		]">
		<table>
			<caption>J'ai {{articles.length}} articles à acheter</caption>
			<tr>
				<th>Article</th>
				<th>Prix</th>
			</tr>
			<tr ng-repeat="article in articles">
				<td>{{article.nom}}</td>
				<td>{{article.prix | currency:"€ "}}</td>
			</tr>
		</table>
	</div>
</div>

CSS

table {
    width: 100%;
}
table, tr, td {
    border: 1px solid #DDDDDD;
    border-collapse: collapse;
}