Angular ngClass ghost class

Question

我正在用ngClass制作一个简单的类切换，使用材质设计图标（可能无关紧要）。这里有一个例子：

<button ng-click="toggle = !toggle"> 
    <i class="mdi" ng-class="{'mdi-filter': toggle, 'mdi-filter-remove': !toggle}"></i> 
</button> 

，并没有出于某种原因，在“MDI - 过滤 - 删除”类将得到取消了对真实评价！所以，为了测试，我将该类更改为“mdi-filter-outline”。有了这个类，它以某种方式正常工作！我只改变了班级，如果我把前一班重新开始，它就不再工作了。最奇怪的是，在切换到“mdi-filter-outline”类之前，“mdi-filter-remove”类闪烁一秒钟。

如果我为切换设置了一个断点并开始点击'step over next function call'，我确实看到'mdi-filter-remove'几次点击后，正好在angular.js中第17286行被执行：

fn(value, ((last === initWatchVal) ? value : last), current); 

这个类不是在项目中任何地方使用，我用原子搜索整个项目，没有匹配！它从何而来？

请帮忙！

Answer 1

您的项目中是否有ngAnimate？如果这样做，那么使用ng-class添加和删除类会导致在幕后添加和删除一些特殊类，以用于转换动画。其中一个特殊课程是-remove后缀的课程。因此，例如，如果您有一个名为my-class的课程，您正在使用ng-class进行添加和删除，那么类别my-class-add和my-class-remove也会随着它们一起显示，无论何时该元素正在过渡。这就是为什么你在一瞬间看到它。

所以，你应该重新命名你的班级。 -remove后缀与自动执行的角度冲突。