title: Change another div's background color on click of div with angular2
body: <p>I have a component on the page which has following divs</p>
  
  <pre><code>&lt;div style=" width:400; height:400; float:left"&gt;
   &lt;div style="background-color:red; width:50%; height:50%; float:left"&gt;
   &lt;/div&gt;
   &lt;div style="background-color:blue; width:50%; height:50%; float:right"&gt;
   &lt;/div&gt;
   &lt;div style="background-color:green; width:50%; height:50%; float:left"&gt;
   &lt;/div&gt;
   &lt;div style="background-color:orange; width:50%; height:50%; float:right"&gt;
   &lt;/div&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>I have another div on the same page as</p>
  
  <pre><code>&lt;div class="eventBox eventBox__colorBar"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>When i click on any of the div above, i want to get the selected color and apply as a background-color for the 2nd div. </p>
  
  <p>How to do with angular2?</p>