zero_coding zero_coding - 23 days ago 6
Dart Question

Class 'NgForm' has no instance getter 'user'

I am trying to build a form based on angular2dart.

The component class:

@Component(
selector: 'start-app',
directives: const[materialInputDirectives],
styleUrls: const ['login_component.css'],
templateUrl: 'login_component.html')
class LoginComponent {

String scaleImg = 'packages/wp_login/assets/scale.svg';
Login login = new Login();

onSubmit() {
print('Submit');
}

}


and the template:

<div class="container">
<div class="row">
<div class="image">
<img [src]="scaleImg">
</div>
<div class="forms">
<form (ngSubmit)="onSubmit()" #login="ngForm">
<div>
<material-input type="text" label="User" [(ngModel)]="login.user"></material-input>
</div>
<div>
<material-input type="password" label="Password" [(ngModel)]="login.password"></material-input>
</div>
<div>
<material-input type="text" label="Language" [(ngModel)]="login.language"></material-input>
</div>
<div>

</div>

</form>
</div>
</div>
</div>


and I've got ther error:

enter image description here

What am I doing wrong?

Answer
 #login="ngForm"

creates a template variable login that references the NgForm directive.

[(ngModel)]="login.user"

fails because login references the #login="ngForm" template variable and the error message is right about that it doesn't have a propertyuser`.

You need to rename either the template variable or the property of your component.

Comments