問題タブ [angularjs-ng-form]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
708 参照

html - 検証のために子コンポーネントのフォームにアクセスする

ツリーの子コンポーネントを含むマスター コンポーネントがある Angular 2 アプリケーションがあります。

私の子コンポーネントの1つ(user_inputと呼びましょう)には、ユーザー入力のあるフォームがあります。私のマスターコンポーネントには、子コンポーネントのフォームが有効かどうかを確認する必要があるボタンがあり、有効になっています。

経由でアクセスしようとしました。(master.view.html より)

しかし、私の user_input フォームはマスターの検証時に初期化されていないため、「不明なタイプの」例外がスローされます。

これを解決する賢い方法はありますか?私は 2 つのサービスを共有していますが、これには使用したくありません。

前もって感謝します!

[アップデート]

ngSwitch に子要素があります。

それを移動すると、エラーは解決されました。ngSwitchに入れる必要があったので、以下に親切に提供されたソリューションを使用しました

0 投票する
2 に答える
3126 参照

javascript - OR および NOT 条件で Angular で ng-show を使用する

2 つの条件に基づいて ng-show を使用することは可能ですか。この場合は 3 つの条件だと思います。おそらく関数またはディレクティブを使用してこれを実行できることはわかっていますが、ビューをロードし、ng-repeat を使用して動的に生成されたフォーム要素にデータを伝播する場合です。実際の入力は無効とマークされておらず、フォーム自体は引き続き有効として送信されるため、この時点で条件を ng-show に追加する方が簡単です。フォームが最初に動的に作成されたフォームの最後の要素をロードすると、$touched = true および $veiwValue が変更されるまで無効であるかのようにエラー メッセージが表示されます。

簡単にするために、私の ng-show は次のようになります。

これにより、無効なエントリとフォーム送信時のエラーに関するエラー メッセージが表示されます。ただし、フォームの読み込み時にエラー メッセージ (エラーであってはならない) も表示されます。そして、最後の入力でフォームに動的に追加されました。

私がやりたいことは次のようなものです:

それが可能かどうか、またはビューが完全にロードされてデータがモデルに追加されたら、関数を呼び出して検証を修正できるかどうかさえわかりません。助言がありますか?

これに使用されるセクション全体を次に示します。

0 投票する
0 に答える
317 参照

validation - angular2のNgForm、NgModelクラスを使用してバリデータを追加するためにフォームのフィールドを参照する方法は?

Angular2のValidatorsを使用して、フォームのフィールドにいくつかの検証を追加したいと考えています。

  • 私はngFormを次のようなフォームにバインドしています:

#form="ngForm"

  • フィールドの場合、私はngModelをバインドしています:

#field="ngModel", [(ngModel)]="model.field" type="text" name="field" placeholder="field"

新しいフォーム APIは ngForm と ngModel の使用を提案していますが、 angular.io docs には Validators の使用方法に関するドキュメントはありませ

NgModel へのapi 参照には、次のようなプロパティがあります validator : ValidatorFnasyncValidator : AsyncValidatorFn

しかし、コンポーネントのクラスからフィールドを参照してバリデータを追加する方法がわかりません。

0 投票する
2 に答える
1236 参照

angularjs - AngularJS フォームの検証: ui.router の状態変更による $dirty 値の変更

私のユースケース:

以下のplunkrのように、ui-routerを使用したマルチステップフォームがあります。$valid、$dirty など、AngularJS によって提供される情報を検証するために ng-form を使用します。

「次のセクション」ボタンをクリックするたびに、ユーザーが終了する前にフォームを終了した場合に備えて、フォームデータをサーバーに送信して取得します。

ユーザーが最初のステップを 2 回送信した場合、編集したデータのみを送信します ($dirty 値が true の場合)。これらはすべて plunkr にはありません。単純なフォームを表示することにしましたが、フォームには 100 のフィールド (ラジオ、チェックボックス、入力、選択など) を含めることができます。

問題を再現する手順 (plunkr):

  1. ステップ 1 を入力して次のセクションに進む
  2. xbox ラジオを確認し、番号をクリックして手順 1 に戻ります。 myMultiStepForm.interests.xbox.$dirty = true
  3. ステップ 2 に戻る myMultiStepForm.interests.xbox.$dirty = false

$dirty の値が false に変更されるのはなぜですか? <ng-form>が再度表示され、すべての検証データがリセットされたためだと思います。

これを回避する方法はありますか?<ng-form>それとも、フィールドのサブセットの検証を処理する以外の何かでしょうか?

これは plunkr です: http://plnkr.co/edit/WclqVgiBvUXlsGdSCcj0?p=preview

0 投票する
1 に答える
929 参照

angularjs - Ng モデルを使用した角度形式の検証

ng-model質問:フォームとその要素に名前を付けることができない場合にのみ、検証エラーを表示するにはどうすればよいですか。

クレジット カードの詳細を収集するための html フォームがあります。クレジット カード データがサーバーにアクセスするのを防ぐため、フォーム要素に名前を付けることができません。したがって、私のフォームは次のようになります。

通常、Angular では、たとえば次のように、フォーム要素名を使用して検証をチェックしていました。

しかし、フォームとその要素に名前を付けることができないため、ng-model のみを使用して検証エラーを表示するにはどうすればよいですか? 以下は機能しないためです。

Angular v1.4.8 を使用しています。

0 投票する
1 に答える
2750 参照

javascript - ng-repeat の外側に送信ボタンがある ng-repeat 内の ng-form

私はこのコードを持っています:

コントローラ:

問題は、ng-repeat と ng-form 内のフォーム入力のみを検証できることです。その html ブロッ​​クの外側でイベントをトリガーする必要があります。助けていただければ幸いです。前もって感謝します。

0 投票する
2 に答える
1401 参照

javascript - Angular - ラジオ ボタンのフォームを検証できません

ボタンformのみがあり、送信前に検証する必要があります(ユーザーは何かを選択する必要があります)。ユーザーがラジオ ボタンを選択した後、 を使用してスタイルを適用する必要があります。2 つの問題があります 。 1. 何らかの理由で、最後のオプションがデフォルトで選択されています。 2. フォームの検証属性を取得できません。データを選択してもデータが更新されません。radioformngclass

プランカー

JS:

HTML:

EDIT これはフォーム出力です。更新されない