NativeScript / Angular - 反应形式不起作用

时间:2017-04-02 10:37:03

标签: nativescript angular2-nativescript angular2-formbuilder reactive-forms

在组件I中这样做:

public loginForm: FormGroup = this.fb.group({
  email: ['', Validators.required],
  password: ['', Validators.required]
});

然后在模板绑定表单中:

<StackLayout orientation="vertical" [formGroup]="loginForm">
  <TextField formControlName="email" hint="Email"></TextField>
  <TextField formControlName="password" hint="Password" secure="true"></TextField>
  <Button text="Log in" (tap)="login()"></Button>
</StackLayout>

但是当我在运行loginForm函数时记录login值时,即使文本字段有值,它仍然为空。

我已导入ReactiveFormsModuleNativeScriptFormsModule,但无法正常工作。如果我将password更改为任意随机名称,我也不会收到错误或任何错误。所以,它甚至没有以任何方式连接到表单。

我做错了什么?我在nativescript cli 2.5+上建议这段代码应该正常工作。

修改

我已经完成了一些挖掘工作,看起来懒惰的加载模块正是导致其破坏的原因。我在这里提出了一个新问题:

https://github.com/NativeScript/nativescript-angular/issues/735

如果有其他人遇到同样的问题以及是否有解决方案,那将会很高兴。

2 个答案:

答案 0 :(得分:0)

因为您已经导入了NativeScriptFormsModule,所以在FormGroup外声明一个新变量并尝试将您的texfield构建为:

<TextField hint="Email" [(ngModel)]="yourEmailVariable"></TextField>

答案 1 :(得分:0)

确保将ReactiveFormsModuleNativeScriptFormsModule导入到实际组件的模块imports(Login.Module.ts)中,而不只是AppModule中,因为否则它将无法正常工作!

我这样做了,然后反应式表格立即开始工作。