Tag Archives: Angular2.x

Angular_ Error: Cannot assign to a reference or variable!

Cannot assign a value to a reference or variable!

<form class="form-horizontal" (ngSubmit)="login(loginForm.value)" role="form" #loginForm="ngForm">
        <div class="form-group">
          <label for="username"></label>
          <input class="form-control" required name="username" id="username" type="textbox" placeholder="Email"
            [(ngModel)]="name" #username="ngModel">

          <div *ngIf="username.invalid && (username.dirty || username.touched)" class="alert alert-danger">
            <div *ngIf="username.errors.required">
              Name is required.
            </div>
          </div>
        </div>
        <div class="form-group">
          <label for="password"></label>
          <input class="form-control" required name="password" id="password" [(ngModel)]="password" type="password"
            placeholder="Password" #passWord="ngModel">
          <div *ngIf="passWord.invalid && (passWord.dirty || passWord.touched)" class="alert alert-danger">
            <div *ngIf="passWord.errors.required">
              Name is required.
            </div>
            <div *ngIf="passWord.errors.minlength">
              Name must be at least 4 characters long.
            </div>

          </div>
        </div>
        <div class="row" style="margin-top: 40px;">
          <div class="col-sm-6">
            <!-- <a class="login-link" routerlinkactive="active" ng-reflect-router-link="/register"
              ng-reflect-router-link-active="active" href="/register"></a> -->
          </div>
          <div class="col-sm-6">
            <button type="submit" class="btn btn-primary pull-right btn-login" [disabled]="!loginForm.form.valid">
              Login</button>
          </div>
        </div>
      </form>

The input #password and the variable defined in the TS file have the same name.
Change can be