使用AngularJS动态地将类添加到Element

时间:2016-02-01 11:16:21

标签: jquery angularjs angular-ng-class

我想使用JQuery模仿我使用AngularJS完成的任务。

以下是fiddle

我在这里做了三件事。

  1. 找到右栏的最后一个元素。
  2. 选择属性'数据颜色'来自它
  3. 将属性的值作为类分配给' right-col'

2 个答案:

答案 0 :(得分:1)

这可以通过angular'js指令(可重用组件)完成,而且angular有jqlite(jQuery库),如下所示。

<强>指令

app.directive('dynamicColor',dynamicColor);

    dynamicColor.$inject = [];

    function dynamicColor(){

      return{
        restrict:'A',
        link:function(scope,element,attrs){
          element.css('background-color',attrs.dynamicColor);
        }
      }

    }

https://plnkr.co/edit/Op5fI5oFQku07tkebBcg?p=preview

答案 1 :(得分:1)

试试这个JSFiddle:https://jsfiddle.net/ubqrah1w/

它使用角度指令。

.directive('lastColor', function () {
  return {
    restrict: 'A',
    link: function ($scope, $element, $attrs) {
    $element.addClass(angular.element($element[0].querySelector('.items:last-child')).attr('data-color'));
    }
  }
  });