入力検証のための角度カスタム指示

私は、angleJSで簡単なカスタム指示文を作成しようとしていますユーザが整数で入力するかどうかを検証します。入力検証のための角度カスタム指示

整数を入力すると、下部にエラーメッセージ「」が表示されます。「整数は許可されていません」。

どのように私はこれを達成することができますか？（フィドルは素晴らしいだろう）

とも...

は$スコープを使用してなしを行うことは可能です。この。$観ますか？

これは、クライアント側の入力の検証を確認するプロフェッショナルかつ効果的な方法ですか？（このアプローチはアプリケーションのパフォーマンスを低下させますか？）

出典

2016-06-26 Simon

あなたが期待しているかもしれないよりシンプルで....デフォルトとしてこの同じパターンに設定されている上記のリンクのドキュメントにng-pattern

<input type="text" ng-model="model" ng-pattern="\\d+" />

デモを使用します。

もちろん、ユーザーのフィードバックをフォームで提供するのは正常です。有効にする必要がありますが、サーバー側の検証を行うことは軽減しません。

出典

2016-06-26 20:31:11 charlietfl

で

angular.module('app') .directive('notNumber', notNumber); function notNumber() { return { require: 'ngModel', link: function(scope, elem, attr, ctrl) { ctrl.$formatters.unshift(function(value) { if (value) { ctrl.$setValidity('notNumber', Number.isNaN(value)); } return value; }); } }; }

いや...コードが動作していない...ユーザーが整数ならば、私はすべてのエラーが表示されない...あなたはバイオリンを作ってくださいできますか？ – Simon

ng-patternを使用して、有効な番号であるかどうかを検証できます。他の方法は、あなたが尋ねたとおりにカスタムディレクティブを作成することです。私はnotNumberの名前で行くつもりです、それはisNumberだけでなく、小さな変化とすることができます。 HTML、

<input type="text" ng-model="model" not-number />

出典

2016-06-26 20:32:12

いいえ...コードが動作していません...ユーザーが整数型を入力するとエラーは表示されません...あなたはフィドルを作ってください。 – Simon

入力検証のための角度カスタム指示

答えて

関連する問題