title: Access Element Style from Angular directive
body: <p>I'm sure this is going to be a "dont do that!" but I am trying to display the style on an angular element.</p>
  
  <pre><code>&lt;div ng-repeat="x in ['blue', 'green']" class="{{x}}"&gt;
          &lt;h3 insert-style&gt;{{theStyle['background-color']}}&lt;/h3&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Result would be </p>
  
  <pre><code>&lt;div class='blue'&gt;&lt;h3&gt;blue(psudeo code hex code)&lt;/h3&gt;&lt;/div&gt;
  &lt;div class='green'&gt;&lt;h3&gt;green(psudeo code hex code)&lt;/h3&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I basically need to get the style attributes and display them.</p>
  
  <p>Directive Code...</p>
  
  <pre><code>directives.insertStyle = [ function(){
      return {
         link: function(scope, element, attrs) {
             scope.theStyle = window.getComputedStyle(element[0], null);
         }
  }   
  }];
  </code></pre>
  
  <p>Fiddle example:  <a href="http://jsfiddle.net/ncapito/G33PE/" rel="nofollow">http://jsfiddle.net/ncapito/G33PE/</a></p>