-2

次のようなhtmlがあるとします。

<html>
<head> angular etc. </head>
<body ng-app>
<div ng-controller="MyCtrl"> 
      <input ng-model="weight" type="number" min="{{minWeight}}" max="{{maxWeight}}">
      <p>{{weight}}</p>
</div>
</body>
</html>

および次のコントローラー:

function MyCtrl($scope){
    $scope.weight = 200;
    $scope.minWeight = 100.0;
    $scope.maxWeight = 300.0;


}

「最小」と「最大」は、ユーザーの入力が悪いことを示します。100 と 300 とハードコーディングすると、値がモデルにまったくバインドされないことが保証されます (なぜ動作は同じですか??)。私がやりたいのは、値が入力要件を満たしている場合にのみ、実際に「重み」を変更することです。何かご意見は？

4

1 に答える 1

1

あなたが何をしようとしているのか、私には完全には理解できません。

HTML:

<html>
<head> angular etc. </head>
<body ng-app="MyApp">
<div ng-controller="MyCtrl"> 
      <input ng-model="weight" type="number" min="{{minWeight}}" max="{{maxWeight}}">
      <p>{{weight}}</p>
</div>
</body>
</html>

角度: [編集]

var app = angular.module('myApp', []);

app.controller('MyCtrl', ['$scope', function MyCtrl($scope){
    $scope.weight = 200;
    $scope.minWeight = 100.0;
    $scope.maxWeight = 300.0;

    $scope.$watch('weight', function (newValue, oldValue) {
        if(typeof newValue === 'number') {
            if(newValue > $scope.maxWeight || newValue < $scope.minWeight) {
                $scope.weight = oldValue;
            }
        }
    });
}]);

しかし、これは私がjsFiddleで作った例です。これがあなたが探していた解決策であることを願っています。

[編集]

http://jsfiddle.net/migontech/jfDd2/1/

[編集2]

入力フィールドの遅延検証を行うディレクティブを作成しました。そして、それが正しくない場合は、最後の正しい値に戻します。これは完全に基本です。それよりも小さい場合は最小値を使用し、それ以上の場合は最大値を使用することができます。それはすべてあなた次第です。ディレクティブは自由に変更できます。

http://jsfiddle.net/migontech/jfDd2/2/

ご不明な点がございましたら、お知らせください。

于 2013-03-26T21:05:31.997 に答える