Question

我希望以编程方式在单个ng-repeat元素上切换类，但我的代码似乎将其设置为所有元素，并且无法重置它。我该如何解决这个问题？

instant.html

<div class="item item-button-right" ng-repeat="service in businessServiceList | filter:services">
  {{service.title}}
  <div class="buttons" style="padding: 0px">
    <button class="button {{buttonStyle}}" ng-click="changeButtonStyle()">
      <i class="ion-android-done"></i>
    </button>
    <button class="button button-stable">
      <i class="ion-android-more-horizontal"></i>
    </button>
  </div>
</div>

controller.js

.controller('BookCtrl', function($scope, ServicesData, $stateParams) {
  $scope.businessServiceList = ServicesData.getBusinessServiceList ($stateParams.business);
  $scope.buttonStyle="button-stable";
  $scope.changeButtonStyle = function(){
    $scope.buttonStyle="button-positive";
  }
})

Answer 1

ng-class，你必须使用！

<div class="item item-button-right" ng-repeat="service in businessServiceList | filter:services">
  {{service.title}}
  <div class="buttons" style="padding: 0px">
    <button class="button" 
        ng-class="{ 'button-positive': isButtonClicked }" ng-click="isButtonClicked = !isButtonClicked">
      <i class="ion-android-done"></i>
    </button>
    <button class="button button-stable">
      <i class="ion-android-more-horizontal"></i>
    </button>
  </div>
</div>

因此，在ng-class属性中，您可以将所有应该按特定条件切换的类放在其中。

以编程方式在ng-repeat元素上切换类

1 个答案: