<p dir="auto"><strong>I'm submitting a ...</strong>  (check one with "x")</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="[x] bug report =&gt; search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question"><pre class="notranslate"><code class="notranslate">[x] bug report =&gt; search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
</code></pre></div>
<p dir="auto">I am not sure if this is the requested behavior, but this behavior does not seem logical to me.</p>
<p dir="auto"><strong>Current behavior</strong><br>
When using Reactive Forms, a formGroup containing FormControls which are invalid is shown as invalid which is normal, but it does not contain any errors.</p>
<p dir="auto"><strong>Expected behavior</strong><br>
We should be able to get all the errors from FormControls | FormGroups | FormArrays inside their containing FormGroup.</p>
<p dir="auto"><strong>Reproduction of the problem</strong><br>
<a href="http://plnkr.co/edit/OMnHZkHRIc75RRQM9XRz?p=preview" rel="nofollow">http://plnkr.co/edit/OMnHZkHRIc75RRQM9XRz?p=preview</a></p>
<p dir="auto"><strong>What is the motivation / use case for changing the behavior?</strong><br>
I have a form with required inputs. I fill in some input but not all of them.<br>
So some input are in the pristine and also invalid. (like in the example of the tutorial for template driven forms): <a href="http://plnkr.co/edit/rzQfRbufDDRmDtGFbPIy?p=preview" rel="nofollow">http://plnkr.co/edit/rzQfRbufDDRmDtGFbPIy?p=preview</a>).</p>
<p dir="auto">I decide to click on the submit button, but I have errors, so I want to show all the inputs with errors that the user has missed.</p>
<p dir="auto"><strong>Please tell us about your environment:</strong><br>
OS X 10.11, Visual Studio Code</p>
<ul dir="auto">
<li>
<p dir="auto"><strong>Angular version:</strong> 2.0.0-rc.6</p>
</li>
<li>
<p dir="auto"><strong>Browser:</strong> [all ]</p>

</li>
<li>
<p dir="auto"><strong>Language:</strong> [TypeScript 2.0.0]</p>
</li>
<li>
<p dir="auto"><strong>Node (for AoT issues):</strong> <code class="notranslate">node --version</code> =   v6.5.0</p>
</li>
</ul>
<p dir="auto"><strong>I'm submitting a ...</strong>  (check one with "x")</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="[ ] bug report
[x feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question"><pre class="notranslate"><code class="notranslate">[ ] bug report
[x feature request
[ ] support request =&gt; Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
</code></pre></div>
<p dir="auto"><strong>Current behavior</strong><br>
When there are errors in a form group, the formGroup.status is 'INVALID' but the formGroup.errors property is null.</p>
<p dir="auto">ex.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="formGroup.controls.username.errors: {invalidEmail: true}
formGroup.errors: null"><pre class="notranslate"><code class="notranslate">formGroup.controls.username.errors: {invalidEmail: true}
formGroup.errors: null
</code></pre></div>
<p dir="auto"><strong>Expected/desired behavior</strong><br>
When the validity of a FormControl changes, have the parent FormGroup.errors merged with the errors from the controls. This is similar to how the angularjs formController.$error property works.<br>
<a href="https://docs.angularjs.org/api/ng/type/form.FormController" rel="nofollow">https://docs.angularjs.org/api/ng/type/form.FormController</a></p>
<p dir="auto"><strong>What is the motivation / use case for changing the behavior?</strong><br>
This would be helpful because I prefer to only disable a submit button when specific errors are on a form, such as required. With this I could drive that attribute off the formControl.errors value instead of formControl.status.</p>
<p dir="auto">ex.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="From:
&lt;button [disabled]=&quot;myForm.status !== 'VALID'&quot;&gt;Submit&lt;/button&gt;

To: 
&lt;button [disabled]=&quot;myForm.errors.required&quot;&gt;Submit&lt;/button&gt;"><pre class="notranslate"><code class="notranslate">From:
&lt;button [disabled]="myForm.status !== 'VALID'"&gt;Submit&lt;/button&gt;

To: 
&lt;button [disabled]="myForm.errors.required"&gt;Submit&lt;/button&gt;
</code></pre></div>