title: Angular 2 dropdown validation not working
body: <p>I have a template driven form with select dropdown and submit button. When I click on submit button, it shows dropdown required validation message, but it also submits the form.
  It shows form is valid in submit function.
  as below code</p>
  
  <pre><code>&lt;form  #f="ngForm"   name="eventForm" id="eventForm"  #eventForm="ngForm"  (ngSubmit)="f.valid &amp;&amp; saveForm(eventForm, $event)" novalidate&gt;
  &lt;div class="form-group" &gt;
    &lt;div class="col-md-6 col-sm-6 col-xs-12"&gt;
      &lt;label for="select_store" class=" control-label"&gt;Select Package&lt;/label&gt;
        &lt;select  multiple tabindex="10"  name="package_id" [ngModelOptions]="{standalone: true}"   #package_id='ngModel'  tabindex="4"   required id="package_id" [(ngModel)]="event.content.package_id"   &gt;
          &lt;option *ngFor="let pk of listDetails" value="{{pk.id}}"&gt;{{pk.name}}&lt;/option&gt;
        &lt;/select&gt;
         &lt;small style="color:red" *ngIf="(eventForm._submitted &amp;&amp; !package_id.valid &amp;&amp; !eventForm.package_id) || (!package_id.valid &amp;&amp; package_id.dirty) "&gt;Content required.&lt;/small&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>Below is my javascript code:</p>
  
  <pre><code>saveForm(form:NgForm, event: Event) {
    console.log(form.valid)     
     event.preventDefault();
  
  }
  </code></pre>
  
  <p>So how to prevent form submitting and make dropdown validation in a correct way?</p>