問題タブ [ng-messages]
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.
javascript - AngularJS の ngMessages 検証は、CSS のエラー メッセージを消去しません
エラーがなく、検証に問題なく合格した場合でも、赤い下線エラーが発生し続ける理由を知っていますか??
両方のパスワードに一致する独自のディレクティブがあり、Angular マテリアルを使用しています。
ここでの作業コード::::::::::::::
http://codepen.io/anon/pen/gPrMRM
http://codepen.io/anon/pen/gPrMRM
Angular アプリと js:
HTML:
ここでの作業コード::::::::::::::
angularjs - ngMessages で再利用可能なフォーム コンポーネントを作成することは可能ですか?
ここに、ディレクティブを作成したいhtmlコードがあります
しかし、コンポーネント、つまり formname.inputname.$error に変数を渡す方法がわかりませんでした
更新:これまでの進捗状況:
テンプレート :
ディレクティブ:
ディレクティブ テンプレート :
angularjs - Angular ng-メッセージ、エラー、警告、およびフォームの有効性
ng-messages を使用して警告とエラーを表示する角度のある (1.4+) 方法はありますか?違いは、警告がフォームを無効にするのではなく、エラーが発生するため、警告があってもユーザーがフォームを保存できるということですか? システムo_Oの明らかな部分であるはずですが、全体を検索しましたが、これについて何も見つからないようです
angularjs - 親コントローラーにカスタムバリデーターを持つngMessages
親スコープにアクセスできるngMessagesを使用してカスタムバリデータを接続する方法を見つけようとしています。住所の入力フィールドがあり、住所onBlur
の地理位置情報を取得し、地図上のマーカーの位置を更新したい (コントローラに 2 つの変数を設定することによりthis
)。
カスタムバリデーターの例ではディレクティブを使用しています (基本的な例ではディレクティブに従いました) が、ディレクティブから地理位置情報に移動できません。
- scope.$parent を使用してリンク関数から親コントローラーにアクセスしようとすることから始めました ( AngularJS のカスタム ディレクティブ *with own scope* 内から親スコープにアクセスする方法は? ) が、私は ES6 クラスを使用しています。うまくいかないようでした。
- 現在、親関数をディレクティブに渡すことを考えていますが、関数はコントローラーの通常のスコープの要素を見つけることができないと不平を言っているため、マーカーの位置を更新できません。
配線のアドバイスありがとうございます。
2番目のインスタンスで到達した場所は次のとおりです
そして、これはコントローラーのスコープで使用できるようにする必要があるコントローラー関数です
angularjs - ng-messages が検証エラーを正しく表示しない
角度のある素材を使用して基本的なフォームを作成しましたが、入力が無効な場合に特定のエラー メッセージが表示されるようにしたいと考えています。ディレクティブを使用して検証エラーを表示する公式 Web サイトの入力例をモデルにしてみました。ng-messages
何らかの理由で、エラー メッセージは、検証状態が有効から無効に移行したときにのみ表示されるようです。
例えば、「有効なメールアドレスを入力してください」というよう<input type="email" required>
な入力があります。<ng-message when="email">
無効なメールを書いてから次の値にタブ移動すると、検証がトリガーされ、無効なスタイルが入力に適用され、メッセージが表示されます。代わりに、何も入力せずにすぐに次の入力に進むと、(required
属性のために) 要素にも無効なスタイルが適用され、期待どおりにメッセージが表示されません (required
)。しかし、もう一度入力にフォーカスして無効なメールを書いた場合、メッセージは表示されません (フォーカスを移動したり元に戻したりしても)。ただし、入力要素にはまだ無効なスタイルが適用されています。このメッセージは、無効なメールを書き (無効なスタイルが要素から削除される)、削除して再度無効にした場合にのみ再び表示されます。
これは、彼の動作を示し、フォーム属性の値を表示する CodePen の例です。マークアップは次のとおりです。
JavaScriptはただの
入力が正しく検証されていることがわかりますが、メッセージ要素に適切なスタイルが適用されていないようです ( opacity: 1
)。
javascript - 複数の条件に基づく ng-messages で検証メッセージを表示する
angular ng-messages を使用して検証メッセージを表示します
次のコードを検討してください。
他のすべての検証に合格し、検証が onlyAfterAllOtherPassedValidation で失敗した場合にのみ、最後の検証メッセージを表示したいと考えています。そして、複雑な条件を ng-message に渡すことがまったく可能かどうかはわかりません。まだ ng-messages を使用できる限り、提案や回避策を歓迎します
angularjs - ng-messagesディレクティブで式を補間する方法は?
「signupForm」というフォーム名があるとしましょう。ボタンで ng-disabled ディレクティブを使用する場合 (フォームが無効な場合にフォームを無効にするため)、使用します
ng-disabled="{{formName}}.$invalid">
(formName には値signupFormが含まれます)
ブラウザでボタンを調べると、上記のディレクティブは と評価されng-disabled="signupForm.$invalid">
ます。これは完璧です。問題は、ng-messages ディレクティブ内で同じ式を使用しようとするとng-messages ="{{formName}}.$error">
、式が補間されないことです。したがって、div でディレクティブを使用してブラウザーで検査すると、次の
<div ng-messages="{{formName}}.$error"></div>
ように表示され<div ng-messages="signupForm.$error"></div>
ます。しかし、これは起こりません。
では、ng-messages ディレクティブが式を補間して正しく表示するにはどうすればよいでしょうか? この問題を AngularJS 1.4.7 & 1.5.0-rc.1 でテストしましたが、両方に問題が存在します。どんな助けでも大歓迎です。ありがとうございました。
angularjs - ng-messages を使用してチェックボックス セットとラジオ セットのエラー メッセージを表示するには?
チェックボックス セットとラジオ セットを検証し、ng-messages ディレクティブを使用してエラー メッセージを表示しようとしましたが、期待どおりに動作しません。ng-messages にはエラー メッセージがまったく表示されません。html ファイルを使用してエラー メッセージを入力しています。エラーが解決されるまで、フォームの送信ボタンは無効になります。
次の場合に、チェックボックス セットとラジオ セットのエラー メッセージを表示するにはどうすればよいですか。
ラジオ セットで 1 つのオプションが選択されていませんか?
チェックボックス セットで少なくとも 1 つのオプションが選択されていませんか?
少なくとも 2 つ以上がチェックされていることを確認できるように、Checkbox セットのチェックをスケーリングしますか?
これが私のフォームです:
メッセージ.html
controller.js
お支払いチェックボックス セット:
javascript - 送信ボタンをクリックした後にngメッセージを使用してフォームの検証を確認する方法は?
検証をチェックするディレクティブを作成し、正常に機能しますが、フォームに完全に入力した後でも、送信ボタンが正しく機能しません。
注:送信ボタン(次のステップ)は、ディレクティブを追加する前に正常に機能していました。角度のあるマテリアルを使用しており、ng-messages は正常に機能していましたが、これらの必須フィールドに入力しようとした場合にのみ機能しましたが、フィールドに触れなかったりミスしたりしなかった場合は機能しませんエラーメッセージを表示するので、次のステップ(送信)がクリックされたときにフォームを検証するvalidFormディレクティブを追加し、ディレクティブを追加した後、次のステップボタンをクリックするとエラーメッセージが表示されますが、次のステップページに移動しません。
ディレクティブ コード :
});
コントローラーコード:
html: