Nativescript无法使用angular 6获取Textfield元素的值

NativeScript版本4.2.4 角度版本6.0

我的登录页面中有两个文本字段

<StackLayout class="input-field">
  <TextField class="input" hint="Username" autocorrect="false" autocapitalizationType="none" [(ngModel)]="user.userName" returnKeyType="next" (returnPress)="focusPassword()"></TextField>
  <StackLayout class="hr-light"></StackLayout>
</StackLayout>

<StackLayout class="input-field">
  <TextField #password class="input" hint="Password" secure="true" [(ngModel)]="user.password" [returnKeyType]="isLoggingIn ? 'done' : 'next'" (returnPress)="focusConfirmPassword()"></TextField>
  <StackLayout class="hr-light"></StackLayout>
</StackLayout>

<StackLayout *ngIf="!isLoggingIn" class="input-field">
  <TextField #confirmPassword class="input" hint="Confirm password" secure="true" [(ngModel)]="user.confirmPassword" returnKeyType="done"></TextField>
  <StackLayout class="hr-light"></StackLayout>
</StackLayout>

<Button [text]="isLoggingIn ? 'Log In' : 'Sign Up'" (tap)="submit()" class="btn btn-primary m-t-20"></Button>

---

您尚未发布用户类，但用户对象及其属性似乎有问题。尝试初始化此对象的空值

export class User {
    userName = "";
    password = "";
}

---

您尚未发布您的用户类，但看起来用户对象及其属性中有问题。尝试初始化此对象的空值

export class User {
    userName = "";
    password = "";
}

由于您正在模板上使用

[（ngModel）]

，因此当您

submit（）

表单时，您将在

user

对象中获得字段值

只需在组件中创建一个

用户

：

user: User = {
  userName: '',
  password: '',
  confirmPassword: ''
};

submit() {
  console.log(this.user);
}

这里有一个供您参考的示例。不在NATIVESCRIPT中。

由于您在模板上使用了

[（ngModel）]

，因此当您在表单上提交（）时，您将在

用户

对象中获得字段值

只需在组件中创建一个

用户

：

user: User = {
  userName: '',
  password: '',
  confirmPassword: ''
};

submit() {
  console.log(this.user);
}

下面是一个供您参考的示例。不在NATIVESCRIPT中。

登录（）函数引用的是

this.password

，而不是

this.user.password

（模板所引用的）

我还添加了一个

用户

类，如他在文章中提到的JakubP

这是一个正常工作的nativescript游乐场链接（所有代码都在HomeComponent中）

函数引用的是

this.password

，而不是

this.user.password

（模板所引用的）

我还添加了一个

用户

类，如他在文章中提到的JakubP

---

这是一个正常工作的nativescript游乐场链接（所有代码都在HomeComponent中）

正如@JakubP所提到的，我认为您忘记导入nativescript FormsModule了

加载项app.module.ts

import { NativeScriptFormsModule } from "nativescript-angular/forms";

...

@NgModule({
  bootstrap: [AppComponent],
  imports: [NativeScriptModule, NativeScriptFormsModule, AppRoutingModule],
  declarations: [AppComponent],
  providers: [],
  schemas: [NO_ERRORS_SCHEMA]
})

---

正如@JakubP提到的，我认为您忘记了导入NativeScriptFormsModule

加载项app.module.ts

import { NativeScriptFormsModule } from "nativescript-angular/forms";

...

@NgModule({
  bootstrap: [AppComponent],
  imports: [NativeScriptModule, NativeScriptFormsModule, AppRoutingModule],
  declarations: [AppComponent],
  providers: [],
  schemas: [NO_ERRORS_SCHEMA]
})

---

尝试在ngOnInit

ngOnInit（）{this.user=new user（）；或this.user={}；

@lesiano显示未定义。还有this.user={}？尝试在ngOnInit

ngOnInit（）{this.user=new user（）；或this.user={}中创建用户；

@lesiano显示未定义。还有this.user={}？奇怪。你检查过样本StackBlitz吗？是的，我已经检查过了。我也在angular工作，我知道如何编写双向数据绑定逻辑。但在nativescript中，这不起作用。奇怪。你检查过样本StackBlitz吗？是的，我检查过了。我也在angular工作，我知道如何编写双向数据绑定逻辑。但是在nativescript中，我s不工作。我还有一个建议-您是否在应用程序或组件模块中导入NativeScript FormsModule？我还有一个建议-您是否在应用程序或组件模块中导入NativeScript FormsModule？