Javascript AngularJS ng repeat获取单击并在jquery中使用的按钮的索引

我这里有一些代码，我想做的是当我点击按钮时，我改变复选框的值，同时改变按钮的颜色。 （例如，选中=红色，取消选中=黑色）

我认为使用jquery更容易做到这一点。我的想法是获取被点击按钮的索引。更改具有相同索引和按钮颜色的复选框的值

但我就是不知道如何选择按钮和复选框

<div id="allcolrepeat">
        <div style="width:200px; float:left; margin:5px;" ng-repeat="col in allColumns">
            <input class="colCheckbox" type="checkbox" ng-change="changeCheck(col.displayName)" ng-model="checkvalue[col.displayName]">
            <button>{{col.displayName}}</button>
        </div>
</div>

{{col.displayName}}

任何帮助都将不胜感激。谢谢

您可以使用指令

ngClass指令允许您通过数据绑定表示要添加的所有类的表达式，在HTML元素上动态设置CSS类

代码

---

注意：声明

红色

和

黑色

css类

如果我理解得很好，这里有一个简单的

您可以通过多种方式来实现，您可以使用

ngClass

或

ngStyle

（示例中的第二个）来更改CSS样式，然后您只需将范围变量分配给

ng model

即可更改复选框值

HTML:

---

这里我使用

ng style

更改按钮颜色：

ng-style="{background : status[$index] ? 'red' : 'blue'}"

但您也可以使用：

ng-class="status[$index] === true ? 'red' : 'blue'"

函数主（$scope）{
$scope.allColumns=[{displayName:“1”}，{displayName:“2”}，{displayName:“3”}，{displayName:“4”}，{displayName:“5”}，{displayName:“6”}，{displayName:“7”}]
}

{{col.displayName}}
好啊

正如在其他答案中提到的，最好使用ng样式或ng类进行样式设置

但问题已经提出，来自谷歌搜索的人们将来看看如何使用jQuery获取索引。。。所以在ng repeat中，可以使用“$index”（）变量，这样就可以将其用作数据属性或任何您想要的内容。在你的特殊情况下，你可以

{{item}}

不要使用Angular和jquery。宝云晨，很高兴我能帮上忙

<div ng-app="myApp" ng-controller="myCtrl">
    <div id="allcolrepeat">
        <div style="width:200px; float:left; margin:5px;" ng-repeat="col in allColumns">
            <input class="colCheckbox" type="checkbox" ng-model="col.displayName">
            <button ng-style="{'background-color': color}" ng-click="col.displayName = 'CHANGED'; color = 'red'">{{col.displayName}}</button>
        </div>
    </div>
</div>

angular.module('myApp', [])
    .controller('myCtrl', ['$scope', '$filter', function ($scope, $filter) {
        $scope.allColumns = [{displayName: 'hello'}, {displayName: 'world'}];
        $scope.color = 'transparent';
}]);

ng-style="{background : status[$index] ? 'red' : 'blue'}"

ng-class="status[$index] === true ? 'red' : 'blue'"