angular.jsを使用して入力フィールドのテキストを検証する

Question

私は文字列の配列を持っています。それらをバーコードと呼ぶことができます。私はこの配列をループし、文字列と入力フィールドを表示するためにAngular.jsを使用しています。私は角度を使用して、ユーザーがこの入力フィールドに新しいバーコードを入力したときに、そのバーコードがすぐ隣に表示されている文字列と同じであることを検証します。以下の例を参照してください。私はng-changeイベントを試してみましたが、これはただ1つの入力フィールドであれば動作しますが、ng-repeatを使用しているため、その作業を行うことはできません。私は指令を作成する必要があると思いますか？私は角度がないので、どんな助けや提案も素晴らしいだろう。ありがとう！

編集：私は、彼らが間違った値が入力された場合、ユーザーに警告する必要が私の目的のために

。私の場合はユーザーが入力フィールドに入力しないので一意です。バーコードスキャナを使用するので、本質的にコピー/ペーストと同じです。 @KKKKKKKKの答えは、私をとても近づけます。私はいくつかの微妙な変更を加えましたが、今は他のバグを紹介しています。下のこのコードでは、適切な警告メッセージが表示されますが、3回発射されますか？角度コントローラで

<input type="text" class="form-control matching" ng-model-options="{ updateOn: 'blur' }" ng-model="item.barcodeInput" placeholder="Barcode"> 
<div ng-show="!isEqualToBarCode($index, item.barcodeInput)"> Error: Value not the same! </div> 

：

$scope.isEqualToBarCode = function(index, val) { 
    if(val === null || val === undefined) return true; 
    if($scope.barcodes.A_adaptors[index] !== val.trim()) { 
     console.log("wrong"); 
     alert("Incorrect Barcode, Try Again."); 
     val = ""; 
    } 
    return $scope.barcodes.A_adaptors[index] === val.trim(); 
} 

Answer 1

はちょうどあなたの配列と比較し、あなたのコマンドに$indexに渡して、私はなぜ..

HTMLを把握することはできません。 （ブラインドコーディングエラーのために申し訳ありませんが）

コントローラー：

$scope.isEqualToBarCode = function(index, val) { 

    //if val is empty, don't display error 
    if(val === null || val === undefined) return true; 

    return $scope.barcodeArray[index].barcodeVal === val.trim(); 
} 

HTML：

<div ng-repeat="item in barcodeArray"> 
    {{item.barcodeVal}} 

    <input ng-model="item.barcodeInput" ng-model-options="{ updateOn: 'blur' }" /> 

    <div ng-show="!isEqualToBarCode($index, item.barcodeInput)"> 
     Oh no! Value not the same! 
    </div> 

</div> 

あなたは、入力された値に基づいてフォームの有効性を設定したい場合は、その後、はい、カスタムディレクティブを作成する必要があります。