Javascript Angular Js：单击一个按钮，选择ng Repeat中的所有按钮，而不是一个

我点击一个按钮（在一个div块中通过ng Repeat添加的许多按钮中），所有按钮都会添加其“活动”类，而不是只点击一个按钮，将所有按钮从蓝色变为红色。（活动类添加背景：“红色”。）

HTML:

<button ng-repeat="x in diseaselist" class="btn btn-primary" ng-click="clicking(diseaselist)" ng-class="{active:diseaselist.active}">{{x.name}}</button>  

CSS:

---

我只希望按钮被点击有“活动”类添加，并变成红色（由CSS）

您正在执行

ng click=“clicking（diseaselist）”

但从我看到的

diseaselist

是所有按钮，您需要使用

x

。

请检查工作示例：

HTML

---

单击的按钮必须只添加“活动”类，但此处ng repeat中的所有按钮都获得“活动”类，而不是仅单击一个。您正在将整个

疾病列表

传递给您的单击，而您可能不想这样做。您应该将x而不是疾病列表作为参数传递给单击…将ng click=“clicking（diseaselist）”更改为ng click=“clicking（x）”

$scope.diseaselist = [{name:"Allergy"},{name:"Arthrites"},{name:"Vomiting"},{name:"Asthma"},{name:"BackPain"}{name:"Malaria"}]

$scope.clicking = function(e){
        e.active = !e.active;
    }

button.active{background:red;color:white;}

  <button ng-repeat="x in diseaselist" class="btn btn-primary" ng-click="clicking($index)" ng-class="{active: active == $index}">{{x.name}}</button>

 $scope.name = 'World';
 $scope.diseaselist = [{
    name: "Allergy"
 }, {
    name: "Arthrites"
 }, {
    name: "Vomiting"
 }, {
    name: "Asthma"
 }, {
    name: "BackPain"
 }, {
    name: "Malaria"
 }];

 $scope.clicking = function(index) {
    $scope.active = index
 };