7 examples of 'angular add class dynamically' in JavaScript

72
function addCssClass(className) {
73
  if (className) {
74
    if (isClassListSupported) {
75
      panel.classList.add(className);
76
    } else {
77
      panel.className += ' ' + className;
78
    }
79
  }
80
}

130
public addCustomClass(className: string): void {
131
  if (!this.customClass.length) {
132
    this.customClass = className;
133
  } else {
134
    if (this.customClass.indexOf(className) === -1) {
135
      this.customClass += ' ' + className;
136
    }
137
  }
138
}

26
function dynamicNameDirective($compile) {
27
28
    return {
29
        restrict: 'A',
30
        terminal: true,
31
        priority: 100000,
32
        link: link
33
    };
34
35
    function link(scope, element) {
36
        var name = element.attr('dynamic-name');
37
        element.removeAttr('dynamic-name');
38
        element.attr('name', name);
39
        $compile(element)(scope);
40
    }
41
}

164
private addClass(classes) {
165
  const classArray = (Array.isArray(classes) ? classes : classes.split(' '));
166
  classArray.filter((element) => element.length > 0).forEach(element => {
167
    this.renderer.addClass(this.el.nativeElement, element );
168
  });
169
}

19
function addJsClass(el) {
20
    var classes = document.body.className.split(" ");
21
    classes.push("js");
22
    document.body.className = classes.join(" ");
23
}

469
function addClasses(el, binding, vnode) {
470
  var classNames = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
471
472
  classNames = __WEBPACK_IMPORTED_MODULE_0_babel_runtime_core_js_object_assign___default()(defaultClassNames, classNames);
473
474
  var model = getValidationModel(binding, vnode);
475
476
  if (!model) {
477
    return;
478
  }
479
480
  var isDirty = model.$dirty;
481
  var isValid = model.$valid;
482
483
  if (isDirty) {
484
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["h" /* addClass */])(el, classNames.touched);
485
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["i" /* removeClass */])(el, classNames.untouched);
486
  } else {
487
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["h" /* addClass */])(el, classNames.untouched);
488
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["i" /* removeClass */])(el, classNames.touched);
489
  }
490
491
  if (isValid) {
492
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["h" /* addClass */])(el, classNames.valid);
493
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["i" /* removeClass */])(el, classNames.invalid);
494
  } else {
495
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["h" /* addClass */])(el, classNames.invalid);
496
    __webpack_require__.i(__WEBPACK_IMPORTED_MODULE_1__utils_index__["i" /* removeClass */])(el, classNames.valid);
497
  }
498
}

148
function directive(scope, element, attrs) {
149
    var ensureCompileRunsOnce = scope.$watch(
150
        function(scope) {
151
            return scope.$eval(attrs.compile);
152
        },
153
        function(value) {
154
            element.html(value);
155
156
            $compile(element.contents())(scope);
157
158
            ensureCompileRunsOnce();
159
        }
160
    );
161
}