title: Displaying bootstrap alert using angular2
body: <p>I want to display Bootstrap alert when the user has saved the data.</p>
  
  <p>my code is as below:</p>
  
  <p>html page:</p>
  
  <pre><code>&lt;div class="alert alert-success" *ngIf="saveSuccess"&gt;
      &lt;strong&gt;Success!&lt;/strong&gt;
  &lt;/div&gt;
  &lt;form #f="ngForm" (submit)="saveUser(f.value)"&gt;
          /////Some form fields
      &lt;button class="form-control btn btn-primary" type="submit"&gt;save&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>app.component.ts:</p>
  
  <pre><code>export class UserProfileComponent{
   saveSuccess: boolean;
   user: IUser;
  
  saveUser(user:IUser) {
      this.headers = new Headers();
      this.headers.append('Content-Type', 'application/json');
      this.editUserForm = user;
      this._http.post('api/user/'+this._current_user._id, JSON.stringify(this.editUserForm),{
          headers: this.headers
      }).subscribe(function(data) {
  
          // if the update is successful then set the value to true
          // this is getting updated
          if (data){
              this.saveSuccess = true;
          }
          else{
              this.saveSuccess = false;
          }
      });
  }
  </code></pre>
  
  <p>}</p>
  
  <p>I want to display the alert when a successful POST is done.</p>
  
  <p>I think i am missing how to bind the 'saveSuccess' variable to html so that alert can be displayed when the successful save is done. (I am new to Angular2)</p>