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

Question

我希望我不会在这里遗漏一些明显的东西，但我正在尝试学习 Angular，但在尝试制定指令时遇到了问题。

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

这是我正在尝试构建的指令： http://cdpn.io/cqvGH

我可以让它将背景应用到 div.item 但是当我尝试定位 ::before no joy.

这是指令代码：

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