Javascript 有条件地添加类，然后将其永久设置为

这可能是一个奇怪的问题，但如果我所问的是可能的话，它将对我非常有用。有没有办法使用条件语句设置一个类，然后将该类冻结到元素上

这就是我想做的-如果一个元素的文本值为

'somestring[A]

，我想根据最后三个字符将这个元素设置为类

greenify

。然后我想将字符串的值更改为

'somestring'

，并保留

greenify

类。请注意，我知道我可以以不同的方式显示此字符串，但对于我的情况，实际上更倾向于更改字符串

---

我有一个方法可以在我的脑海中实现这一点，但如果有一个角度的方法来实现这一点，它会变得越来越清晰。任何帮助都将不胜感激

我想问题是，在初始更改之后，是否需要更改类的值？如果没有，您可以在该值上设置一个自定义手表，然后在更改后取消对其的跟踪。通过取消匹配，类绑定将不会在DOM中更新

var unWatch = $scope.$watch('myVar', function() {
  // set class on element

  unwatch();
});

---

如果需要再次更新该值并设置类，则可以在需要时添加回看并取消切换。

以下是我使用指令针对自定义环境提出的解决方案。我希望它能帮助别人

.directive('colorByChange', function(){
    return {
        scope: {test: '=passedValue'},
        link: function(scope, element){
            element.ready(function(){
                var txt = scope.test;
                switch (txt.slice(-3, txt.length)) {
                    case '[A]':
                        element.addClass('greenify');
                        element.text(scope.test.slice(0, -3));
                        break;
                    case '[U]':
                        element.addClass('bluify');
                        element.text(scope.test.slice(0, -3));
                        break;
                    case '[D]':
                        element.addClass('redify');
                        element.text(scope.test.slice(0, -3));
                        break;
                }
            });
        }
    }
});

HTML

{{handle}}

谢谢。这是一个很好的答案，但并不适合我的问题。我正在研究它，当我弄明白这一点时，我会发布结果。你有一个关于JSFIDLE或Plunkr的例子，我可以看看，以更好地了解问题的背景吗？这是一个大问题！问题是我有一个复杂的数据结构，不知道“myVar”是什么样子。我已经创建了一个指令，几乎可以正常工作了——完成后我会把它发布到这里

<span ng-repeat="handle in brand.handles" color-by-change passed-value="handle">
  {{handle}}
</span>