title: Angular 2- Parent with multiple children
body: <p>I have a situation where at first seemed fairly straight forward to myself but after a couple of days changing my solution structure it has become so convoluted!
  Well I have a got a parent/child component relationship as following:</p>
  
  <ul>
  <li>Parent
  
  <ul>
  <li>Child 1
  
  <ul>
  <li>Grandchild 1</li>
  <li>Grandchild 2</li>
  <li>Grandchild 3</li>
  </ul></li>
  <li>Child 2
  
  <ul>
  <li>Grandchild 1</li>
  <li>Grandchild 2</li>
  <li>Grandchild 3</li>
  </ul></li>
  </ul></li>
  </ul>
  
  <p>Each of these components (parent, child and grand child) has a property as "isValid" and a "validate()" method. All I want to achieve is a solution in which each component validity state depends on its own validate logic PLUS validity of all children component. 
  Here is a simple validation rules for each component:</p>
  
  <ul>
  <li>Parent isValid = true if all children and grandchildren are valid</li>
  <li>Child isValid = true if number of its children neither more than 3 and nor less than 1 Plus all children are valid</li>
  <li>grandchild isValid = true if the textbox within it has a value</li>
  </ul>
  
  <p>I have already read this <a href="https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-child-on-changes" rel="nofollow noreferrer">https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#parent-to-child-on-changes</a> and tried all possible ways it describes but neither fits my requirements of having the parent level component valid if ALL its children are valid!</p>
  
  <p>thanks for your advice in advance :)</p>