1

私が欲しいのは、数値以外を入力すると赤い枠線が表示される数値のみの入力です。

私がしたことは

<input ng-model="number" name="number" type="number" step="any" />

この

.ng-dirty.ng-invalid {
  border: 1px solid red;
}

「何とか何とか」と$valid == false入力すると、赤い境界線が表示されなくなります。これは、「何とか何とか」と入力してもモデルが更新されないため、入力に ng-dirty クラスが配置されないためです。入力がすぐに赤く縁取られたくないのは明らかですが、どうすればこれに対処できますか?

ここでテストできますhttp://plnkr.co/edit/HWGKkzmxVx0GYIiRGyqX?p=preview

ありがとう。

PS: 私は 1.1.5 を使用してクロムを使用しています

// 編集

私が削除すると、required有効になることさえありますhttp://plnkr.co/edit/E763TRUnYr47xwGqJOkG?p=previewどうやら

4

3 に答える 3

0

これはブラウザの「バグ」です (実際には予想される動作です) https://github.com/angular/angular.js/issues/2144 を参照してください。このhttps://groups.google.com/forum/#のようないくつかの回避策があります!トピック/角度/pRc5pu3bWQ0/ディスカッション

または、同じ原則を使用して独自の入力ディレクティブを作成することもできます

app.directive('input', [function() {
    return {
        restrict: 'E',
        require: '?ngModel',
        link: function(scope, el, attrs, ctrl) {
            if (attrs.type == 'number' && typeof el.prop('validity') !== 'undefined') {
                el.on('keyup change', function() {
                    var validity = el.prop('validity');
                    ctrl.$setValidity('badInput', !validity.badInput);                      
                });
            }
        }
    };
}]);
于 2013-12-11T10:02:34.553 に答える