NativeScript/Angular - 使用操作栏时无法使用的表单

首先我实现了下面的代码。NativeScript/Angular - 使用操作栏时无法使用的表单

app.component.html

<StackLayout [formGroup]="form"> 
    <label text="Name"></label> 
    <TextField formControlName="Name"></TextField> 
    <label text="Last Name"></label> 
    <TextField formControlName="LastName"></TextField> 
    <button text="save" (tap)="save()"></button> 
</StackLayout>

app.component.ts

public form: FormGroup; 

constructor(private fb: FormBuilder){ 
    this.form = this.fb.group({ 
     "Name": ["", [Validators.required]], 
     "LastName": ["", [Validators.required]] 
    }); 
} 

public save(){ 
    console.log(JSON.stringify(this.form.value)); 
}

当我运行上面的代码，它的一切好起来。我得到正确的名字和姓氏。

当我尝试向此代码添加操作栏时，会发生此问题。

app.component.html

<ActionBar title="New" class="action-bar">   
    <ActionItem text="save" (tap)="save()"></ActionItem>  
</ActionBar> 
<StackLayout [formGroup]="form"> 
    <label text="Name"></label> 
    <TextField formControlName="Name"></TextField> 
    <label text="Last Name"></label> 
    <TextField formControlName="LastName"></TextField> 
    <button text="save" (tap)="save()"></button> 
</StackLayout>

的app.component.ts保持不变。

当我运行此代码并点击stacklayout中的按钮时，我正确地得到名称和姓氏，但是当我点击ActionItem时，我得到一个空字符串，用于名称和姓氏。我错过了什么吗？

来源

2017-07-10 Bruna Nayara

你的代码看起来很好 - 事实上，我已经用this test application对它进行了测试，并且一切按我的预期工作。

备注：如果在iOS上进行测试时请记住，如果后续控制台日志相同，则只能打印一次。（this），所以可能是因为看起来事实上该操作完成时日志并未打印。

来源

2017-07-14 08:49:17

感谢尼克:)现在它工作。我的代码是在AppComponent中，所以我创建了另一个组件，在那里粘贴了我的代码，这很好。 app.component.html中的页面路由器插座能否成为我的代码之前无法工作的原因？ –

NativeScript/Angular - 使用操作栏时无法使用的表单

回答

相关问题