
<div class="form-display">
  <div  *ngIf="user" id="disp">
    <h2 class="page-header">Account Details</h2>
    <form (submit)="addAccount(user)">
      <div class="form-group">
        <label> First Name: </label>
        <input type="text" ng-model="first_name" name="first_name" class="form-control" value={{user.first_name}} disabled>
      </div>
      <div class="form-group">
        <label> Last Name:</label>
        <input type="text" ng-model="last_name" name="last_name" class="form-control" value={{user.last_name}} disabled >
      </div>
      <div class="form-group">
        <label> Account Number:</label>
        <input type="number" [(ngModel)]="acc_no" name="acc_no" class="form-control" >
      </div>
      <div class="form-group">
        <label> Account Type:</label>
        <input type="text" [(ngModel)]="acc_type" name="acc_type" class="form-control" >
      </div>
      <div class="form-group">
        <label> Balance:</label>
        <input type="text" [(ngModel)]="balance" name="balance" class="form-control" >
      </div>
      <input type="submit" class="btn btn-primary"  id="submit_button" value="Submit">
    </form>
  </div>
</div>

<hr>
<div class="row">
  <div class="container">
    <div *ngFor="let t of accounts">
      <div class = "col-md-2">
        {{t.acc_no}}
      </div>
      <div class = "col-md-2">
        {{t.acc_type}}
      </div>
      <div class = "col-md-2">
        {{t.balance}}
      </div>
      <div class ="col-md-2">
        <input type= "button"  value="Delete" (click) = "deleteAccount(t._id)" value="Delete" class="btn btn-danger">
      </div>

      <br><br>
    </div>

  </div>

</div>
