Kann ich AngularJs-Direktiven verwenden, um einen Stil auf ein Pseudo-Element anzuwenden

Question

Ich hoffe, ich vermisse hier nicht etwas Offensichtliches, aber ich versuche Angular zu lernen, und ich habe ein Problem beim Versuch, eine Direktive zu erstellen.

Ich versuche eine Direktive zu erstellen, die die URL von einem Datenattribut ('background-image') übernimmt und diese als Hintergrundbild auf ein Pseudoelement anwendet, aber ich habe Probleme herauszufinden Zielen Sie auf das :: before-Element oder auch wenn Angular ein Pseudo-Element modifizieren kann.

Hier ist die Direktive ich zu bauen versuche: http://cdpn.io/cqvGH

ich es bekommen kann den Hintergrund anwenden, sondern auf div.item, wenn ich versuche, das :: vor keine Freude Ziel. Hier

ist die Richtlinie Code:

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

Es ist schwierig, aber möglich. Versuchen Sie so etwas wie:

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

Arbeiten hier: http://codepen.io/anon/pen/Difrt