ng-ifがページの負荷で動作していない

入力が3チャラクタ未満または6チャラクタ未満の場合にエラーを表示する小さな角度検証があります。ng-ifがページの負荷で動作していない

私がやったことは、入力を入力し始めたときだけエラーが表示され、それ以外の場合は表示されません。私はページをロードし、確実にページの読み込みには3未満であるので、エラーを表示する必要がありますが、入力時に入力を開始するとエラーが表示されます。

私のhtml：

<form name="someform"> 
<input type="text" ng-model="handle"/> 
<div ng-if="handle.length<lowcharec" class="alert" style="color: red">sorry, maxlength cannot be less than 3 
</div> 
<div ng-if="handle.length>highcharec" class="alert" ng-init="highcharec" style="color: red">sorry, maxlength cannot be greater than 6 
</div> 
<input type="submit"/> 

</form>

私のスクリプト：私は何かが欠けていると角に新しいですMAM

$scope.lowcharec = 3; 
$scope.highcharec = 6;

、plsは私が間違っているのものを導きます。

出典

2016-04-26 user3450590

HTMLにいくつかのタイプミスがあります。さらに、ng-init = "highcharec"は何もしません。最終的には、コントローラ内で変数を初期化する方が良いでしょう。$ scope.handle = [];を追加してください。 – Walfrat

完全なコードが表示されていません。実際の問題が何であるかを理解することは容易ではありません。ここでは、実際の例を見ることができます。あなたのhandle変数は、ページのロード時にまだ定義されていません（そして、あなたがそれに入力を開始するまでそのまま）、およびundefined < 3がfalseに評価されるためです

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

 
app.controller('FormCtrl', function($scope) { 
 
    $scope.handle = ''; 
 
    $scope.lowcharec = 3; 
 
    $scope.highcharec = 6; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="app"> 
 
    <form name="someform" ng-controller="FormCtrl"> 
 
    <input type="text" ng-model="handle" /> 
 
    <div ng-if="handle.length < lowcharec" class="alert" style="color: red">sorry, maxlength cannot be less than 3 
 
    </div> 
 
    <div ng-if="handle.length > highcharec" class="alert" ng-init="highcharec" style="color: red">sorry, maxlength cannot be greater than 6 
 
    </div> 
 
    <input type="submit" /> 
 

 
    </form> 
 
</body>

出典

2016-04-26 07:34:24 niyasc

@niyascに感謝します。申し訳ありませんが、完全なコードは表示されませんが、walfratは正しいと言いました。私は$ scope.handle = []を定義しませんでした。ちょうどそれをして、それは私にページの読み込みでエラーを表示し始めます – user3450590

。これを修正するには、ng-ifをng-if="handle.length<lowcharec || !handle"に変更してください。

出典

2016-04-26 07:36:23

ng-ifがページの負荷で動作していない

答えて

関連する問題