0

まず、以下のコードを実装しました。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をタップすると名前と姓の両方に空の文字列が表示されます。何か不足していますか?

答えて

0

あなたのコードはちょうどいいようです - 実際には私はthis test applicationでそれをテストしましたが、すべてが私の側で期待通りに機能します。

サイドノート:iOSのテストでは、後続のコンソールログが同一であれば、一度しか印刷できないことに注意してください。 (this)、実際にアクションが実行されたときにログが出力されないように見えることがあります。

+0

ありがとうございます。ニック:)それは今働いています。私のコードはAppComponentにありましたので、別のコンポーネントを作成してそこにコードを貼り付けました。 app.component.htmlのページルータコンセントが私のコードが以前に動作しなかった理由ですか? –

関連する問題