title: angular cannot receive emitted value
body: <p>I'm trying to emit value from <code>DropdownComponent</code> to <code>TaskComponent</code>:</p>
  
  <p><a href="https://i.stack.imgur.com/X4l0i.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/X4l0i.png" alt="enter image description here"></a></p>
  
  <p><code>DropdownComponent</code> is located inside of <code>NavBbrComponent</code> (<code>AppModule</code>) and <code>TaskComponent</code> is in <code>MainComponent</code> which belongs <code>HomeModule</code>.</p>
  
  <p>In <code>DropdownComponent</code> there is <code>select</code> definition:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;select class="form-control minimal" id="project" name="project" [(ngModel)]="selectedProject" (change)="onChange($event.target.value)"&gt;
    &lt;option&gt;Project 1&lt;/option&gt;
    &lt;option&gt;Project 2&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>with <code>onChange</code> method which emit value:</p>
  
  <pre><code>onChange(event) {
      this.toTask.emit(event);
    }
  </code></pre>
  
  <p>Value is binded in Main Component where is definition of the Task component</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;app-task (toTask)="fromDropdown($event)"&gt;&lt;/app-task&gt; 
  </code></pre>
  
  <p>but there is no value in <code>TaskComponent</code>.</p>
  
  <p><a href="https://stackblitz.com/edit/angular-kd665m" rel="nofollow noreferrer">Stackblitz</a></p>