Динамически добавлять класс в элемент, используя AngularJS
Я хочу подражать тому, что я сделал с JQuery
с помощью AngularJS
,
Ниже скрипка для этого.
Три вещи, которые я сделал здесь.
- Найдите последний элемент в правом столбце.
- Возьмите с него атрибут data-color
- Присвойте значение атрибута как класс 'правой колонке'
2 ответа
Решение
Попробуйте это 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'));
}
}
});
Это может быть сделано с помощью директивы 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);
}
}
}