Question

我有一个运行Ionic / Angular的应用程序，我需要的是应用一个来自animate.css library的类，我这里有一个这个函数，一旦你调用$scope.addLineToBetSlip()就可以了一旦你调用了这个函数，我想要我提到的那个类：

$scope.addLineToBetSlip = function(line, row, type) {
  $scope.picksCount = !$scope.picksCount;
  var spreadSelected = (row.spreadSelected && type === 'spread'),
    totalSelected = (row.totalSelected && type === 'total'),
    moneyLineSelected = (row.moneyLineSelected && type === 'moneyline');
  if (spreadSelected || totalSelected || moneyLineSelected) {
    BetSlipFactory.remove(line, row, type);
  }else {
    BetSlipFactory.add(line, row, type);
  }
  return $scope.picksCount;
};

这是我错误的HTML：

更新

只是更改我的代码，现在正在工作，但只是第一次{{betSlipCount}}变形

<span class="badge badge-assertive animate infinite"
      ng-class="{bounceIn: picksCount}">{{betSlipCount}}</span>
<i class="icon ion-code-download"></i>

我看到的另一种方式是，{{betSlipCount}}不断变化，实际上{{betSlipCount}}每次调用$scope.addLineToBetSlip()时都会发生变化，因此另一种方式是每次{{betSlipCount}}激活该类{ {1}}更改。

Answer 1

我使用过ng-class已经有一段时间但是我很确定语法是：
ng-class="{'className': booleanVariable}"
（意思是你有倒退的班级名称和变量）
（您也可以尝试用单引号括起班级名称，但我不确定是否有必要）

布尔变量可以是返回布尔变量的函数，即：
ng-class="{'fadeIn': addLineToBetSlip()}"

但是看起来你的函数没有返回一个布尔变量。你可以在$ scope中切换一个布尔变量，并使用该变量名而不是函数，或者你可以让函数返回true。

但是我也不确定为什么你不会总是想要'fadeIn＆＃39;上课。

也许您可以告诉我们更多关于您的代码应该做什么以及它目前正在做什么。

<强>更新
控制器代码：

//Intialize the boolean variable
$scope.picksCount = false;

$scope.addLineToBetSlip = function(line, row, type) {
    var spreadSelected = (row.spreadSelected && type === 'spread');
    var totalSelected = (row.totalSelected && type === 'total');
    var moneyLineSelected = (row.moneyLineSelected && type === 'moneyline');

    if (spreadSelected || totalSelected || moneyLineSelected)
    {
        BetSlipFactory.remove(line, row, type);
    }
    else
    {
        BetSlipFactory.add(line, row, type);
    }

    $scope.picksCount = !$scope.picksCount;

};

HTML代码：

<span class="badge badge-assertive animate infinite" ng-class="{'bounceIn': picksCount}">{{betSlipCount}}</span>
<i class="icon ion-code-download"></i>

如何动态添加数据时应用ng-class（？）

1 个答案: