113 votes

Erreur : Impossible d'assigner à une référence ou à une variable ! Angular 4

J'obtiens une erreur dans angular 4 après avoir ajouté un nouveau code html, auparavant le formulaire fonctionnait bien. J'ai essayé de commenter le nouveau code mais cela ne fonctionne toujours pas - que faire - J'ai fait des recherches sur cette erreur et j'ai essayé de la résoudre mais rien n'a aidé - je n'ai pas non plus trouvé l'emplacement exact du problème.

Mon code :

<form role="form" #adminForm="ngForm" (ngSubmit)="logAdmin(adminForm.form)">
          <div class="form-group">
            <input class="form-control" [(ngModel)]="adminUsername" #adminUsername="ngModel" placeholder="Username" type="text" name="adminUsername"
              required>
            <div *ngIf="adminUsername.touched && adminUsername.errors">
              <div class="alert alert-danger" *ngIf="adminUsername.errors.required">Username is required</div>
            </div>
          </div>
          <div class="form-group">
            <input class="form-control" [(ngModel)]="passwordText" #adminPassword="ngModel" id="adminPassword" name="adminPassword" placeholder="Password"
              type="password" required>
          </div>
          <div class="alert alert-danger" *ngIf="adminPassword.touched && adminPassword.errors">Password is required</div>
          <div class="col-md-6" style="text-align: right">
            <button type="submit" class="btn-yellow" [disabled]="!adminForm.valid">Log In</button>
          </div>
        </form>

Erreur que je reçois :

Error: Cannot assign to a reference or variable!
    at _AstToIrVisitor.visitPropertyWrite (webpack-internal:///../../../compiler/esm5/compiler.js:26550:23)
    at PropertyWrite.visit (webpack-internal:///../../../compiler/esm5/compiler.js:4895:24)
    at convertActionBinding (webpack-internal:///../../../compiler/esm5/compiler.js:26000:45)
    at eval (webpack-internal:///../../../compiler/esm5/compiler.js:28519:22)
    at Array.forEach (<anonymous>)
    at ViewBuilder._createElementHandleEventFn (webpack-internal:///../../../compiler/esm5/compiler.js:28515:18)
    at nodes.(anonymous function) (webpack-internal:///../../../compiler/esm5/compiler.js:27934:27)
    at eval (webpack-internal:///../../../compiler/esm5/compiler.js:28460:22)
    at Array.map (<anonymous>)
    at ViewBuilder._createNodeExpressions (webpack-internal:///../../../compiler/esm5/compiler.js:28459:56)
    at _AstToIrVisitor.visitPropertyWrite (webpack-internal:///../../../compiler/esm5/compiler.js:26550:23)
    at PropertyWrite.visit (webpack-internal:///../../../compiler/esm5/compiler.js:4895:24)
    at convertActionBinding (webpack-internal:///../../../compiler/esm5/compiler.js:26000:45)
    at eval (webpack-internal:///../../../compiler/esm5/compiler.js:28519:22)
    at Array.forEach (<anonymous>)
    at ViewBuilder._createElementHandleEventFn (webpack-internal:///../../../compiler/esm5/compiler.js:28515:18)
    at nodes.(anonymous function) (webpack-internal:///../../../compiler/esm5/compiler.js:27934:27)
    at eval (webpack-internal:///../../../compiler/esm5/compiler.js:28460:22)
    at Array.map (<anonymous>)
    at ViewBuilder._createNodeExpressions (webpack-internal:///../../../compiler/esm5/compiler.js:28459:56)
    at resolvePromise (webpack-internal:///../../../../zone.js/dist/zone.js:824:31)
    at resolvePromise (webpack-internal:///../../../../zone.js/dist/zone.js:795:17)
    at eval (webpack-internal:///../../../../zone.js/dist/zone.js:873:17)
    at ZoneDelegate.invokeTask (webpack-internal:///../../../../zone.js/dist/zone.js:425:31)
    at Object.onInvokeTask (webpack-internal:///../../../core/esm5/core.js:4944:33)
    at ZoneDelegate.invokeTask (webpack-internal:///../../../../zone.js/dist/zone.js:424:36)
    at Zone.runTask (webpack-internal:///../../../../zone.js/dist/zone.js:192:47)
    at drainMicroTaskQueue (webpack-internal:///../../../../zone.js/dist/zone.js:602:35)
    at <anonymous>

J'ai cherché sur Internet et j'ai trouvé des questions et des réponses pour la même erreur, mais je n'ai pas trouvé de solution qui ait fonctionné pour moi... C'est pourquoi cette erreur peut se répéter mais la réponse semble être différente de celle des autres.

330voto

Abdeali Chandanwala Points 2185

Le problème est que j'avais renommé le nom de la variable ngModel exactement de la même manière.

[(ngModel)]="adminUsername" #adminUsername="ngModel" 

La solution qui a fonctionné pour moi

[(ngModel)]="adminUsernameText" #adminUsername="ngModel"

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X