title: Angular 4: Close modal after form submit event is finished
body: <p>i am using bootstrap 4 modal.when i press the close button modal closes properly. but i want to close the modal after submitting the create button present in the form. i am using angular 4.</p>
  
  <pre><code>&lt;div class="modal fade" id="createLabel" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"&gt;
  &lt;div class="modal-dialog" role="document"&gt;
   &lt;div class="modal-content"&gt;
    &lt;div class="modal-header"&gt;
      &lt;h5 class="modal-title" id="exampleModalLabel"&gt;New project&lt;/h5&gt;
      &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;
        &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
      &lt;/button&gt;
    &lt;/div&gt;
    &lt;div class="modal-body"&gt;
     &lt;form name="form"  (ngSubmit)="f.form.valid &amp;&amp; newproject(createLabel)" #f="ngForm" novalidate &gt;
        &lt;div class="form-group" [ngClass]="{ 'has-error': f.submitted &amp;&amp; !projectname.valid }"&gt;
              &lt;input type="text" class="form-control" placeholder="Your Project Title. Eg. Building Ark v1.0" name="projectname"  [(ngModel)]="createLabel.projectname"  minlength="3" #projectname="ngModel" required /&gt;
              &lt;div *ngIf="f.submitted &amp;&amp; !projectname.valid" class="help-block" style="color: red;"&gt;Atleast 3 charater&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="form-group" &gt;
                 &lt;button type="button" class="btn btn-secondary" data-dismiss="modal"&gt;Close&lt;/button&gt;
                  &lt;button [disabled]="loading" class="btn btn-primary" &gt;Create&lt;/button&gt; &lt;/div&gt;
          &lt;/form&gt;
    &lt;/div&gt;
  
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>