Question

我希望我不会错过任何明显的东西，但我正在努力学习Angular，并且在尝试制定指令时遇到了问题。

我正在尝试构建一个指令，该指令将从数据属性（'background-image'）获取url并将其作为背景图像应用于伪元素，但我无法确定如何定位:: before元素，或者即使Angular可以修改伪元素。

这是我要构建的指令： http://cdpn.io/cqvGH

我可以将它应用于div.item的背景但是当我尝试在没有欢乐之前定位::。

这是指令代码：

angular.module('testApp', [
])

angular.module('testApp')
  .directive('backgroundImage', function(){
    return function(scope, element, attrs){
        restrict: 'A',
        attrs.$observe('backgroundImage', function(value) {
      // If I remove ::before it will apply image background to .item correctly.
        element::before.css({
                'background-image': 'url(' + value +')'
            });
        });
    };
});

Answer 1

这很棘手，但可能。尝试类似：

 var style = "<style>.item:before{background-image:url("+value+")}</style>"
 angular.element("head").append(style);

在此工作：http://codepen.io/anon/pen/Difrt

我可以使用AngularJs指令将样式应用于伪元素

1 个答案: