Directive qui ne marche pas sur smartphone
Bonjour,
je suis en train de faire un site ou j'utilise un système de notation "rating".
J'ai trouvé une directive qui fait bien le boulot, on peut cliquer, je récupère la valeur, etc...
Cependant, ça ne marche pas sur smartphone, on dirait que les étoiles sont des images qui sont non cliquables...
Je ne comprend pas pourquoi... si quelqu'un a une piste de pourquoi ca ne marche pas et comment je peut régler le problème, j'ai pas trouvé grand chose sur le net et ça fait déjà un moment que je galère
voici ma directive
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
|
app.directive("rating", function() {
return {
restrict: "EA",
require: 'ngModel',
template: '<ul class="rating">' +
'<li class="star" ng-repeat="note in notes" ng-class="{\'filled\': note.valid}" ng-click="rate($index)">' +
'\u2605' +
'</li>' +
'</ul>',
scope: {
ratingMaxValue: '=',
ngModel: '='
},
link: function (scope, elem, attrs, ngModelCtrl) {
var updateComponent = function() {
scope.notes = [];
for (var i = 0; i < scope.ratingMaxValue; i++) {
scope.notes.push({valid: i < ngModelCtrl.$modelValue});
}
};
scope.rate = function(index) {
for (var i = 0; i < scope.notes.length; i++) {
if(i <= index) {
scope.notes[i].valid = true;
} else {
scope.notes[i].valid = false;
}
}
ngModelCtrl.$setViewValue(index + 1);
};
scope.$watch('ngModel', function(oldVal, newVal) {
updateComponent();
});
}
};
}); |
et dans mon
Code:
1
2
|
<rating rating-max-value="5" ng-model="rating"></rating> |
Merci
