1 <div class="panel panel-primary">
2 <div class="panel-heading">
3 <h3 class="panel-title">Please pick a Username</h3>
5 <div class="panel-body form-inline">
6 <div class="form-group">
7 <div class="input-group input-group-primary">
8 <label for="name" class="input-group-addon">Username</label>
9 <input id="name" type="text" class="form-control" placeholder="Enter your username" [formControl]="usernameForm">
11 <div *ngIf="usernameForm.invalid && (usernameForm.dirty || usernameForm.touched)"
12 class="alert alert-danger">
14 <div *ngIf="usernameForm.errors?.['required']">
19 <button type="submit" class="btn btn-primary" (click)="updateName()" [disabled]="usernameForm.invalid">Pick Name</button>
22 <p>Value: {{ usernameForm.value }}</p>
23 <p>Form Status: {{ usernameForm.status }}</p>