复选框上的toggleClass选择在ng-repeat中取消选择

时间:2015-01-21 07:40:39

标签: angularjs angularjs-ng-repeat toggleclass

我想在复选框勾选时将ng-repeat中的行的类更改为活动,或者取消选中复选框上的活动类

<table><tbody><tr><td><b>S No.</td><td><b>Name</td><td><b>Email-Id</td><td><b>Birthday</td><td><b>Contact</td><td><b>Action</td></tr>
         <tr ng-repeat="(key,user) in users"  ng-style="myStyle"  ng-class="{selected: $index==selectedRow}">
                      <blockquote><td><input type ="checkbox" ng-model="isChecked" ng-class="active">{{key+1}}</td><td>{{user.name}}</td> 


        <td>{{user.email}}</td><td>{{user.dob }}  </td> <td>{{contact }}</td><td><a href="" ng-click="removeUser(user)"  > remove | </a><a href="#" ng-click="enableEditor($index)" >  Edit user</a></td> 
                     </input>

                  <input type="button" value="Red" ng-click="myStyle={background:'red'}">     

                    </blockquote> </tr>  
                      </tbody></table> 

1 个答案:

答案 0 :(得分:0)

将HTML更改为以下内容。您需要为每一行设置isChecked状态。

<table><tbody><tr><td><b>S No.</td><td><b>Name</td><td><b>Email-Id</td><td><b>Birthday</td><td><b>Contact</td><td><b>Action</td></tr>
         <tr ng-repeat="(key,user) in users"  ng-style="myStyle"  ng-class="{active: user.isChecked}">
                      <blockquote><td><input type ="checkbox" ng-model="user.isChecked" ng-class="active">{{key+1}}</td><td>{{user.name}}</td> 


        <td>{{user.email}}</td><td>{{user.dob }}  </td> <td>{{contact }}</td><td><a href="" ng-click="removeUser(user)"  > remove | </a><a href="#" ng-click="enableEditor($index)" >  Edit user</a></td> 
                     </input>

                  <input type="button" value="Red" ng-click="myStyle={background:'red'}">     

                    </blockquote> </tr>  
                      </tbody></table>