角2有条件主动类在第二条件不工作

我添加代码以显示排序方向以及颜色选择的列看到plunker 角2有条件主动类在第二条件不工作

如果排序节目向上/向下箭头：工作
如果升序显示下行活跃色箭头：ACTIVE不适用
如果降显示了活跃的色彩箭头：工作

这里是代码的应用程序类conditi onally：

<i class="fa fa-lg" [ngClass]="{'fa-sort' : column !== 'ProjectID', 
    ' fa-sort-asc active' : (column === 'ProjectID' && !isDesc), 
    ' fa-sort-desc active' : (column === 'ProjectID' && isDesc) }" 
    aria-hidden="true"></i>

见ASC和DESC都有这与DESC真实的情况只有工作活动类，请参阅plunker更多细节。

这里应用了所有条件后的代码：

<i aria-hidden="true" class="fa fa-lg fa-sort"></i> 
<i aria-hidden="true" class="fa fa-lg fa-sort-asc"></i> // active missing 
<i aria-hidden="true" class="fa fa-lg fa-sort-desc active"></i>

任何想法，为什么它的行为就像这样：

来源

2017-04-26 Ali Adravi

-1

条件在ngClass顺序应用。当ngClass中的条件评估为false时，它将删除相应的类。如果同一个班级在两种情况下，可能会首先添加，但在下一个条件下，它将被删除。

可能的解决方案是：

转变作风类.active-asc, .active-desc {color: red;}，然后分别将它们的条件;

或

添加新的条件'active' : column === 'columnName'

来源

2017-04-27 07:58:51 Modzello

角2有条件主动类在第二条件不工作

回答

相关问题