title: Angular: Call parent component function when all child components complete data load
body: <p>I am using Angular6 and am stuck in a situation where I have a parent component (say parent) which has 3 child components (say child1, child2, child3). 
  parent-component.html looks like this:</p>
  
  <pre><code>&lt;div&gt;
    &lt;child1&gt;&lt;/child1&gt;
    &lt;child2&gt;&lt;/child2&gt;
    &lt;child3&gt;&lt;/child3&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>All the child components call their services (which in turn fetch data from http APIs) and load their own data. All the components have different data load time (say child1 has 1 sec, child2 has 2 sec and child3 has 3 sec).</p>
  
  <p>I want to execute a function in paren when ALL three child components have loaded their data that they got from service.</p>