Question

我遇到了一个非常奇怪的问题。我正在使用Jquery来更改多个元素的类。我是通过js方面的for循环来做的。单击元素时，它会更改类以显示“已选择”并更改背景。但它实际上并没有改变观点。

奇怪的是，我无法在视图方面看到这些变化，但是当我安排了它们正在使用这些类的元素时。

HTML SIDE

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

CONSOLED ELEMENT

我无法找到确切的解决方案......

Answer 1

您可以使用角度方式更改类名称，如

＆＃13;

<!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){
	
  $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>

＆＃13;

通过jquery更改类但不反映在html视图端

1 个答案: