2016-07-26 5 views
0

Ich leide an einem sehr seltsamen Problem. Ich benutze Jquery, um Klassen von mehreren Elementen zu ändern. Ich mache es mit einer for-Schleife auf der js-Seite. Beim Klicken auf ein Element werden die Klassen so geändert, dass "ausgewählt" angezeigt wird und der Hintergrund geändert wird. Aber es ändert nicht wirklich die Ansicht.Ändern der Klasse von jquery, aber nicht auf der HTML-Seite reflektieren

Das Seltsame ist, dass ich die Änderungen auf der Sichtseite nicht sehen kann, aber wenn ich die Elemente getröstet habe, hatte es die Klassen.

HTML SIDE

<li id="1469532600" class="slot ng-binding ng-scope time-slot" ng-repeat="slot in timeSlots">17:00</li> 

trösteten ELEMENT

enter image description here

ich nicht in der Lage bin, die genaue Lösung zu finden ...

+0

Bitte geben Sie CSS und JavaScript-Code. Erstellen Sie besser eine Geige, um Ihr Problem zu replizieren. Und warum verwenden Sie JQuery, um stattdessen class try ng-class zu ändern. – Manish

Antwort

0

Sie Winkel Art und Weise verwenden können, wie Klassennamen zu ändern

<!DOCTYPE html> 
 
<html> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
<body> 
 
<style> 
 
.selected{color:green;} 
 
</style> 
 
<script> 
 
var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.names=[ 
 
{name:'Jani',country:'Norway'}, 
 
{name:'Hege',country:'Sweden'}, 
 
{name:'Kai',country:'Denmark'}]; 
 

 
$scope.makeSelect = function(index){ 
 
\t 
 
    $scope.names[index].selected = true; 
 
} 
 
}); 
 

 

 
</script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl" ng-init=""> 
 

 
<p>Looping with objects:</p> 
 
<ul> 
 
    <li ng-class="names[$index].selected==true ? 'selected':''" ng-repeat="x in names" ng-click="makeSelect($index);"> 
 
    {{ x.name + ', ' + x.country + '------'+x.selected }}</li> 
 
</ul> 
 

 
</div> 
 

 
</body> 
 
</html>