使用 angularjs 修改 css 类

Question

我正在尝试更改输入单选组中所选按钮的类别。每个按钮代表一个座位，然后将显示所选的总数。

   $scope.calculateChecked = function() {

      var count = 0;

      

      angular.forEach($scope.data, function(value) {

        if(value.checked)

          count++;

      });

      

      return count;

   };

这是我的 plunker 示例： http://plnkr.co/edit/wKzcz6TbYmfbL5mW? open=lib%2Fscript.js&deferRun=1

What I'm trying to accomplished is that when a particular seat selected (ie: seat 4), then all the previous seat (1,2,3) will be selected automatically, and then calculated as 4 seats price, like so

我知道我使用的是过时的版本，但我仍在学习基础知识。

提前感谢所有帮助和建议，非常感谢:)

Answer 1

这是我的Plunker演示。在您看来：不是使用模型的show属性而是使用属性user.checked，这样您就不必同步两个值。<label style="width:100px;padding: 13px;border-radius: 5px;background: dimgray;&nbsp; &nbsp; &nbsp; &nbsp;text-align: center;color: white;box-shadow: 0px 0px 17px -4px rgba(140,140,140,1);"&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;ng-class="{checked: user.checked}"><input type="checkbox" style="display:none" value="1" name="options"&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;ng-model="user.checked" ng-click="userClick(user)"/><i class="fas fa-couch h2 px-2"></i><br />${{price}}{{ x }}</label>控制器：添加此功能$scope.userClick = function(user) {&nbsp; &nbsp; if(user.checked) {&nbsp; &nbsp; &nbsp; &nbsp;var i = 0;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp;while($scope.data[i].name != user.name)&nbsp; &nbsp; &nbsp; &nbsp;{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $scope.data[i].checked = true;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; i++;&nbsp; &nbsp; &nbsp; &nbsp;};&nbsp; &nbsp; }};