NativeScript ng2 双向绑定在 TextField 上不起作用
NativeScript ng2 two way binding doesn`t work on TextField
我正在制作一个移动应用程序。在我的登录表单中,我有 2 个 TextFields
<TextField hint="Email Address" keyboardType="email" [(ngModel)]="email" autocorrect="false" autocapitalizationType="none"></TextField>
<TextField hint="Password" secure="true" [(ngModel)]="password"></TextField>
<Label [text]="email"></Label>
在component.ts
import { Component, OnInit } from '@angular/core';
import { Router } from "@angular/router";
import { NativeScriptRouterModule } from "nativescript-angular/router";
import { Page } from "ui/page";
import * as Toast from 'nativescript-toast';
@Component({
moduleId: module.id,
selector: 'sign-in',
templateUrl: "template.html"
})
export class SignInPage implements OnInit {
email: string ="example";
password: string;
constructor(private router: Router, page: Page) {
page.actionBarHidden = true;
}
ngOnInit() {
var loginParams = { user: { email: this.email }, password: this.password };
console.dump(loginParams);
}
}
标签显示 "example" 但 textField 没有。更改 textField 的值不会更改组件逻辑中的值。
任何的想法?
ps。我已经在我的@ngModule
中导入了 NativescriptFormsModule
确保不仅在 AppModule 中在声明 SignInPage 组件的模块上导入 NativescriptFormsModule。
如果您在项目的许多地方使用它,您可能希望将它放在共享模块中,例如:
// shared.module.ts
.....
import { NativeScriptFormsModule } from "nativescript-angular/forms";
@NgModule({
imports: [
.....
NativeScriptFormsModule,
.....
],
declarations: [
.....
],
exports: [
.....
NativeScriptFormsModule,
.....
]
})
export class SharedModule { }
// signon.module.ts
.....
import { SharedModule } from "../shared/shared.module";
要在 nativescript 中启用双向数据绑定,您必须在模块中导入 NativeScriptFormsModule。它就像 FormsModule,我们使用 angular 启用双向数据绑定。
import { NativeScriptFormsModule } from "nativescript-angular/forms";
@NgModule({
imports: [
NativeScriptFormsModule
]
})
我正在制作一个移动应用程序。在我的登录表单中,我有 2 个 TextFields
<TextField hint="Email Address" keyboardType="email" [(ngModel)]="email" autocorrect="false" autocapitalizationType="none"></TextField>
<TextField hint="Password" secure="true" [(ngModel)]="password"></TextField>
<Label [text]="email"></Label>
在component.ts
import { Component, OnInit } from '@angular/core';
import { Router } from "@angular/router";
import { NativeScriptRouterModule } from "nativescript-angular/router";
import { Page } from "ui/page";
import * as Toast from 'nativescript-toast';
@Component({
moduleId: module.id,
selector: 'sign-in',
templateUrl: "template.html"
})
export class SignInPage implements OnInit {
email: string ="example";
password: string;
constructor(private router: Router, page: Page) {
page.actionBarHidden = true;
}
ngOnInit() {
var loginParams = { user: { email: this.email }, password: this.password };
console.dump(loginParams);
}
}
标签显示 "example" 但 textField 没有。更改 textField 的值不会更改组件逻辑中的值。 任何的想法?
ps。我已经在我的@ngModule
中导入了 NativescriptFormsModule确保不仅在 AppModule 中在声明 SignInPage 组件的模块上导入 NativescriptFormsModule。
如果您在项目的许多地方使用它,您可能希望将它放在共享模块中,例如:
// shared.module.ts
.....
import { NativeScriptFormsModule } from "nativescript-angular/forms";
@NgModule({
imports: [
.....
NativeScriptFormsModule,
.....
],
declarations: [
.....
],
exports: [
.....
NativeScriptFormsModule,
.....
]
})
export class SharedModule { }
// signon.module.ts
.....
import { SharedModule } from "../shared/shared.module";
要在 nativescript 中启用双向数据绑定,您必须在模块中导入 NativeScriptFormsModule。它就像 FormsModule,我们使用 angular 启用双向数据绑定。
import { NativeScriptFormsModule } from "nativescript-angular/forms";
@NgModule({
imports: [
NativeScriptFormsModule
]
})