Question

这可能是一个奇怪的问题，但如果我提出的问题是可能的话，对我来说会很有用。有没有办法使用条件语句设置类，然后将该类冻结到元素上？

这就是我想要做的 - 如果一个元素的文本值为'somestring[A]'，我想根据最后三个字符将此元素设置为类greenify的样式。然后我想将字符串的值更改为'somestring'并保留greenify类。请注意，我知道我可以以不同的方式显示此字符串，但对于我的情况，实际上更改字符串是首选。

我有一种方法可以在我的脑海中实现这一点，但是如果有一种有角度的方式可以做得更清楚也更清晰。任何帮助将不胜感激。

Answer 1

我想问题是，您是否需要在初始更改后更改类的值？如果没有，您可以在值上设置自定义监视，然后在更改后取消监视。通过取消它，类绑定不会在DOM中更新。

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

  unwatch();
});

如果您需要重新更新的值并设置课程，您可以重新添加手表并在需要时取消观看。

Answer 2

这是我使用指令为我的自定义环境提出的解决方案。我希望它有所帮助。

.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

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

有条件地添加类然后在角度中永久设置它

2 个答案: