Bonjour,
Je suis tombé par hasard sur une bizarrerie dans angularjs. J'ai un ngRepeat qui semble s'exécuter plusieurs fois.
ma page html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=yes" />
<title>mon site</title>
<link rel="stylesheet" href="css/app.css">
</head>
<body ng-app="app" ng-controller="GeneralCtrl">
<header>
<nav>
<ul>
<li ng-repeat="menu in menus" ng-class=testHeader($index)>
<button type="button" class="btn">
<span class="{{menu.classImage}} img"></span> <span class="">{{menu.texte}}</span>
</button>
</li>
</ul>
</nav>
</header>
<!-- Angular -->
<script src="lib/angular/angular.min.js"></script>
<!-- Application -->
<script src="js/app.js"></script>
</body>
</html>
mon js:
'use strict';
var app = angular.module('app', ]);
/*
* Routes configuration
*/
app
.controller('GeneralCtrl', function($scope) {
$scope.menus =
{
"classImage": "img1",
"texte": "1",
},
{
"classImage": "img2",
"texte": "2",
},
{
"classImage": "img3",
"texte": "3",
}
];
$scope.testHeader = function(index) {
console.log("index " + index);
};
});
J'ai fait une page très simple pour chercher le problème.
J'ai bien un seul menu dans ma page, mais le résultat dans la console me donne:
index 0
index 1
index 2
index 0
index 1
index 2
index 0
index 1
index 2
Donc 3 répétitions.
Merci pour votre aide.
ras92