3

私はこれに本当に苦労しています。ユーザーに姓と名を 1 つのテキスト ボックスだけに入力させる必要があります。私は AngularJS を使用しており、ng-pattern を使用してテキスト フィールドを検証したいと考えています。このフィールドにはすべての文字を入力でき、2 単語が必要です。これは入力です：

<input name="fistname_lastname" ng-model="fistname_lastname" ng-pattern='my_pattern' type="text">

次のように、コントローラーに私のパターンがあります。

$scope.my_pattern = /^\s*\w*\s*$/;

別のより良い方法はありますか。

4

2 に答える 2

4

はい、ディレクティブでも実行できますが、テキストだけに2文字が含まれているかどうかを検証ng-patternする方が良い方法です。

ここで、html は(.*?[a-zA-Z]){2,}このパターンを使用します。

HTML

<input type="text" ng-model="fistname_lastname" max-length="30" 
ng-pattern="/^(.*?[a-zA-Z]){2,}$/" placeholder="add new todo here"/>

働くフィドル

アップデート

フォームの送信を停止したい場合は、心配する必要はありません。Angular はこれを内部的に管理します。ng-patternフォームフィールドに対して言及するたびに、角度はそのフィールドのオブジェクトを作成します（フィールドnameにはng-model属性が必要です）。そのオブジェクトは特定のフィールドの有効性を担当します。ng-patternregx が満たされないように、Angular はそのフィールドを asにします。invalidこれは、追加 ng-invalid-pattern&ng-invalidクラスを意味します。その結果、フォームも無効になります。フォームオブジェクトを見ると、フォームがhtmlのinvalid構文を使用して取得されていることがわかります。form.$valid

HTML

<form name="form" ng-submit="submit()">
    <input type="text" ng-model="firstname_lastname"  size="30" ng-pattern="/^(.*?[a-zA-Z]){2,}$/" placeholder="add new todo here"/>

    <button type="submit">Submit</button>
</form>

コントローラ

$scope.submit = function(){
    if($scope.form.$invalid) //here you can stop use from submitting for by checking validity
        alert('Form is invalid'); //form is invalid
    else
         alert('Form is valid');//here you can do actual submit to server
}

更新されたフィドル

うまくいけば、これはあなたを助けることができます、ありがとう.

于 2015-02-24T15:38:10.860 に答える