如何应用基于ng类的属性并点击Angular？

Question

我们需要根据数据切换属性和用户单击更改CSS类。我们已经可以根据用户点击事件来更改课程。

如何更改用户点击和基于数据切换属性的类？

HTML：

<a ng-click="iconChange('FF'+$index)" 
    href="#" data-toggle="collapse"> 
    <span title="{{idx}}" 
      ng-class="{'glyphicon1 down': FF{{$index}}, 'glyphicon1 right': !FF{{$index}} }" && 
      ng-attr-data-toggle="{{ collapse ? true : false }}"> 
    </span> 
</a> 

JS：

$scope.iconChange = function(idx){ 
          $scope[idx] = !$scope[idx]; 
         }; 

Answer 1

使用ui-boostrap collapse指令切换项目是否已展开。

我相信你的模板中的ng-class属性可以得到改善。尝试如下所示。

<a ng-click="iconChange($index)" 
    href="#"> 
    <span title="{{idx}}" class="glyphicon1" 
      ng-class="{down: showDown[$index], right: !showDown[$index] }" 
    </span> 
</a> 
<div uib-collapse="showDown[$index]">...</div> 

然后你的控制器应包括

// Initialize object 
$scope.showDown = {}; 

$scope.iconChange = function(idx){ 
    $scope.showDown[idx] = !$scope.showDown[idx]; 
} 

这可能会是一个非此即彼的属性设置比插值变量名。