title: Angular 2 Unexpected closing tag
body: <p>Im having trouble with Angular 4 and html. I get unexpected closing tag  first. When I remove the form closing tag, then I get the same error but with .
  Im a rookie by the way, so it may be a very dumb mistake. Here is the code, thanks!</p>
  
  <pre><code>&lt;div class="app flex-row align-items-center"&gt;
    &lt;div class="container"&gt;
      &lt;div class="row justify-content-center"&gt;
        &lt;div class="col-md-6"&gt;
          &lt;div class="card mx-2"&gt;
            &lt;div class="card-block p-2"&gt;
              &lt;h1&gt;Register&lt;/h1&gt;
              &lt;p class="text-muted"&gt;Create your account&lt;/p&gt;
              &lt;form *ngIf="creatingUser"
                class="example-form"
                (ngSubmit)="onSubmit(userForm)"
                #userForm="ngForm"
                fxFlexFill [fxLayout]="'row'"
                fxLayoutAlign="center start"&gt;
              &lt;div class="input-group mb-1"&gt;
                &lt;span class="input-group-addon"&gt;&lt;i class="icon-user"&gt;&lt;/i&gt;&lt;/span&gt;
                &lt;input type="text" fxFlex="100"
                 required
                 minlength="3"
                 placeholder="Username"
                 [(ngModel)]="user.profile.username"
                 name="username"
                 #username="ngModel"&gt;
              &lt;/div&gt;
  
              &lt;div class="input-group mb-1"&gt;
                &lt;span class="input-group-addon"&gt;@&lt;/span&gt;
                &lt;input type="text" placeholder="Email" name="email" #email="ngModel" id="email"
                 required
                 pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$"
                 placeholder="Email"
                 [(ngModel)]="user.profile.email"&gt;
              &lt;/div&gt;
  
              &lt;div class="form-group row"&gt;
                &lt;label class="col-md-3 form-control-label" for="select"&gt;Select role&lt;/label&gt;
                &lt;div class="col-md-9"&gt;
                  &lt;select id="select" name="select" size="1" placeholder="Role" [(ngModel)]="user.role" name="role"&gt;
                    &lt;option *ngFor="let role of roles" [value]="role"&gt;{{role.name}}&lt;/option&gt;
                  &lt;/select&gt;
                &lt;/div&gt;
                &lt;/div&gt;
  
              &lt;div class="input-group mb-1"&gt;
                &lt;span class="input-group-addon"&gt;&lt;i class="icon-lock"&gt;&lt;/i&gt;&lt;/span&gt;
                &lt;input type="password" placeholder="Password" name="password" #password="ngModel"
                 required
                 minlength="6"
                 [(ngModel)]="user.password"&gt;
              &lt;/div&gt;
  
              &lt;div class="input-group mb-2"&gt;
                &lt;span class="input-group-addon"&gt;&lt;i class="icon-lock"&gt;&lt;/i&gt;&lt;/span&gt;
                &lt;input class="form-control" name="repeatPassword" #repeatPassword="ngModel"
                 validateEqualTo="password"
                 type="password"
                 required
                 placeholder="Confirm Password"
                 [(ngModel)]="user.confirmPassword"&gt;
              &lt;/div&gt;
  
              &lt;button type="button" class="btn btn-block btn-success"&gt;Create Account&lt;/button&gt;
              &lt;button type="button"
                [color]="'warn'"
                (click)="creatingNewUser(false)"&gt;
              &lt;/button&gt;
              &lt;button type="submit"
                      [color]="'primary'"
                      [disabled]="!userForm.form.valid"&gt;
              &lt;/button&gt;
              &lt;/form&gt;
              &lt;div *ngIf="!creatingUser"&gt;
                &lt;button [color]="'primary'" (click)="creatingNewUser(true)"&gt;
                &lt;/button&gt;
            &lt;/div&gt;
            &lt;div class="card-footer p-2"&gt;
              &lt;div class="row"&gt;
                &lt;div class="col-6"&gt;
                  &lt;button class="btn btn-block btn-facebook" type="button"&gt;&lt;span&gt;facebook&lt;/span&gt;&lt;/button&gt;
                &lt;/div&gt;
                &lt;div class="col-6"&gt;
                  &lt;button class="btn btn-block btn-twitter" type="button"&gt;&lt;span&gt;twitter&lt;/span&gt;&lt;/button&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>