NativeScript ng2 双向绑定在 TextField 上不起作用答案

【问题标题】：NativeScript ng2 two way binding doesn`t work on TextFieldNativeScript ng2 双向绑定在 TextField 上不起作用
【发布时间】：2017-04-19 17:51:26
【问题描述】：

我正在制作一个移动应用程序。在我的登录表单中，我有 2 个文本字段

<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>

在组件.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);
    }
}

标签显示“示例”，但 textField 没有。更改 textField 的值不会更改组件逻辑中的值。任何想法？

ps。我已经在我的@ngModule 中导入了 NativescriptFormsModule

【问题讨论】：

标签： angular typescript nativescript angular2-forms angular2-nativescript

【解决方案1】：

确保您在声明 SignInPage 组件的模块上导入 NativescriptFormsModule，而不仅仅是在 AppModule 中。

【讨论】：

我在我的组件中导入了这个模块仍然不起作用:(
我第一次不了解你。我做Yoy说的和它的工作！谢谢老兄！

【解决方案2】：

如果您在项目的许多地方使用它，您可能希望将它放在一个共享模块中，例如：

// 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";

【讨论】：

【解决方案3】：

要在 nativescript 中启用双向数据绑定，您必须在模块中导入 NativeScriptFormsModule。就像 FormsModule 一样，我们使用 Angular 来实现双向数据绑定。

import { NativeScriptFormsModule } from "nativescript-angular/forms";
@NgModule({
  imports: [
    NativeScriptFormsModule
  ]
})

【讨论】：