2016-08-11 62 views
1

我想使用angular2數據綁定以編程方式更新TextField文本屬性。從here看來我會在我的佈局中設置[(ngModel)] =「email」,然後在我的代碼中添加屬性電子郵件。使用當前設置,我可以在加載時更改文本屬性,但是如果我嘗試以編程方式從按鈕更改文本屬性,則單擊電子郵件更改時不會反映在視圖的TextField文本屬性中。NativeScript 2/Angular 2數據綁定[(ngModel)]如何以編程方式更新TextField。

import { Component, OnInit } from '@angular/core'; 
import { User }    from '../../shared/user/user'; 
import { LoginModel }  from '../../model/login/login-model'; 
import { HttpService }  from '../../services/http/http-service'; 

@Component({ 
    selector:'login', 
    templateUrl:'pages/login/login.component.html', 
    providers: [HttpService] 
}) 

export class LoginComponent implements OnInit { 
    email:string = "[email protected]"; 
    user: User; 
    //model: LoginModel; 
    constructor(private _httpService: Httpservice) { 
     //this.model = new LoginModel(); 
     this.user = new User(); 
    } //default constructor 

    ngOnInit() {} 

    onButtonTap() { 
     //alert("onButtonTap clicked "); 
     //this._mpixService.register(this.model.user); 

     this.email = "[email protected]"; 
     alert("onButtonTap clicked " + this.email); 
    } 
} 

我的觀點

<ActionBar title="Login Mpix Tap To Print"> 
    <ActionItem text="Login" android.systemIcon="ic_menu_share_holo_dark" ios.systemIcon="9" ios.position="right"></ActionItem> 
</ActionBar> 
<StackLayout> 
    <TextField hint="Email Address" keyboardType="email" 
     autocorrect="false" autocapitalization="none" [text]="email"></TextField> 
    <TextField hint="Password" secure="true" keyboardType="password" 
     autocorrect="false" autocapitalization="none" [(ngModel)]="password"></TextField> 

    <Button text="Sign In" (Tap)='onButtonTap()'></Button> 
    <Button text="Sign up for Mpix" [nsRouterLink]="['/signup']"></Button> 
</StackLayout> 

我自己也嘗試文本字段的變化查看屬性

<TextField hint="Email Address" keyboardType="email"  autocorrect="false" autocapitalization="none" [text]="email" (emailChange)="email=$event"></TextField> 

<TextField hint="Email Address" keyboardType="email"  autocorrect="false" autocapitalization="none" [(ngModel)]="email" [text]=email></TextField> 

<TextField hint="Email Address" keyboardType="email"  autocorrect="false" autocapitalization="none" [(ngModel)]="email">{{email}}</TextField> 

文本字段設置爲當界面首次加載[email protected]

+0

[(ngModel)] = 「電子郵件」 文本= {{電子郵件}}>也不會與該工作。 – dsum27

回答

0

此問題已固定有最近的更新。在下面的鏈接中有更多的細節,基本上有一個無關的構建問題,在我的代碼能夠運行之前停止代碼。在更新tns-core-modules和nativescript-angular之後,它與上面的代碼一起工作。

Nativescript 2.2 exception

8

可能必須進口NativeScript形式模塊插入NgModule進口陣列:

進口{NativeScriptFormsModule}從「nativescript棱角/形式」;

和NgModule屬性

@NgModule({進口:[NativeScriptFormsModule]})

相關問題