Question

使用element.addClass不会将类添加到元素上。如果我从模板中删除class="progress-radial progress-{{percentage}}"，则无论如何都可以。

由于代码正确触发，不确定到底出了什么问题，如果属性已经存在，似乎并不想添加新类。

angular.module(moduleName, [])
.directive('npProgress', function() {
  return {
    restrict: 'AE',
    replace: true,
    scope: {
      percentage: '@'
    },
    template: '<div class="progress-radial progress-{{percentage}}">' +
    '<div class="overlay">{{percentage}}</div>' +
    '</div>',
    link: function(scope, element, attrs) {
      if ( scope.percentage > 50 ) {
        element.addClass('progress-radial--positive');
      }
    }
  }
});

Answer 1

用ng-class指令替换插值类。

错误

//AVOID interpolated class
template: '<div class="progress-radial progress-{{percentage}}">' +
               '<div class="overlay">{{percentage}}</div>' +
          '</div>',

USE ng-class="'progress-'+percentage"：

template: '<div class="progress-radial" ' +
                'ng-class="' +"'progress-'" + '+percentage">' +
              '<div class="overlay">{{percentage}}</div>' +
          '</div>',

插值字符串的绑定正在通过自定义指令对抗更改。

这是一个已知问题

已知问题

动态更改内插值

您应该避免动态更改插值字符串的内容（例如属性值或文本节点）。当原始字符串被评估时，您的更改可能会被覆盖。

- AngularJS Developer Guide -- Interpolation -- Known Issues

Answer 2

尝试使用num1 += '';

添加课程

Here is the Documentation.

在angular.element上使用 parseInt ，因为您使用 scope.percentage发送 string percentage 绑定。

parseInt将字符串转换为整数然后进行比较。

@

Angular指令类未应用

2 个答案:

已知问题