title: Can an Angular ng-mousover event trigger ng-style on multiple elements?
body: <p>I'm currently learning Angular and I have a question.</p>
  
  <p>I have two divs that change their background color on triggering the <code>ng-mouseover</code> directive. here is a little snippet of the two divs.</p>
  
  <pre><code>&lt;div id="mid-left" class="col-lg-4"&gt;
      &lt;div class="row  left-section" ng-repeat="variance in variances.variance_data" ng-style="background" ng-mouseover="background = setColor(variance)" ng-mouseleave="background = {}"&gt;
  &lt;/div&gt;
  
  &lt;div id="mid-right" class="col-lg-4"&gt;
      &lt;div class="row right-section" ng-repeat="variance in variances.variance_data" ng-style="background" ng-mouseover="background = setColor(variance)" ng-mouseleave="background = {}"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I assumed that the <code>background</code> variable I declared in the directives would be added to the existing <code>$scope</code>.</p>
  
  <p>With the two divs being bound to the 'same variable' (in my mind) I assumed they would both change on when either <code>ng-mouseover</code> event was triggered.</p>
  
  <p>Any and all help is highly appreciated.</p>