<p dir="auto">I'm not sure if this is a bug or not but the behavior doesn't make sense.  I'm using a model driven form on my page and one of the controls has two synchronous validators (required and minlength) and a custom asyncValidator.  When the page initially loads the form control is empty so it should be failing the required and minlength validations.  The custom validator will return valid when the field is empty.  However, the state of the control is being set Valid on form initialization.   Previously my custom async validator had been a synchronous validator and it worked as expected, i.e. the custom validator is initially valid but the form control is still invalid due to the other validations being invalid.</p>
<p dir="auto">The following plnkr illustrates the behavior:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="http://plnkr.co/edit/VJlg1Q1EXs9mQ8Bx2YTQ?p=preview"><pre class="notranslate"><code class="notranslate">http://plnkr.co/edit/VJlg1Q1EXs9mQ8Bx2YTQ?p=preview
</code></pre></div>
<p dir="auto">Also, note that the after form initialization the async validator only runs after satisfying the minlength requirement (in this case upon typing the 6th character) while the sync validator runs on every key press and the sync validator is run twice on form initialization while the async validator only runs once.  Another thing is that the form control with the async validator will report invalid if you type some characters then delete them all making the field empty.</p>
<p dir="auto"><strong>I'm submitting a ...</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="[X] bug report"><pre class="notranslate"><code class="notranslate">[X] bug report
</code></pre></div>
<p dir="auto"><strong>Current behavior</strong></p>

<p dir="auto">If I have a sync and a async validation on a formControl the async validation overwrites the sync validation when it comes back even if the value has changed. So if I put in something in a field that passes the sync validation the async validation triggers. However when I then change the value of the field before the last async validation have come back to something that doesn't pass the sync validation the last value async validation becomes the winning one.</p>
<p dir="auto"><strong>Expected behavior</strong></p>

<p dir="auto">Probably that the async validation should be ignored if the value has changed since the request?</p>
<p dir="auto"><strong>Minimal reproduction of the problem with instructions</strong></p>

<p dir="auto"><a href="http://plnkr.co/edit/MrY2Gq03dNjp8hvET3cn?p=preview" rel="nofollow">http://plnkr.co/edit/MrY2Gq03dNjp8hvET3cn?p=preview</a></p>
<ol dir="auto">
<li>Fill in <a href="mailto:whatever@whatever.com">whatever@whatever.com</a> in the input field.</li>
<li>Within 5 seconds, change the value of the field to asdf.</li>
<li>Wait a second or two and now the Control is valid, but asdf is not valid according to the sync validation.</li>
</ol>
<ul dir="auto">
<li><strong>Angular version:</strong> 2.1.12</li>
</ul>

<ul dir="auto">
<li><strong>Browser:</strong>: Tested in latest Chrome and Safari</li>
</ul>

<ul dir="auto">
<li><strong>Language:</strong>: Typescript</li>
</ul>