カスタムanglejsを作成したいユニークな値の指示

Question

私は重複するユーザー名をチェックするディレクティブを作成したいと思います。ですから、私はindex.htmlファイルとuniqueIdディレクティブを作成しました。今指示に私はngModel.setValidity()をすることができません。それはundefinedを得ています。

また、ローカルのjsonファイルusername.jsonからデータを取得しています。

コンソールログconsole.log(ngModel.$setValidity('unique', unique))をコンソールに接続すると、undefinedと表示されます。

私はコードのplunkを作成しました::

https://embed.plnkr.co/XTPf9PjiMn9if5Y0DaHt/

Answer 1

JSONに存在するユーザーを反復処理する必要があります。 currentValueのいずれかが一致する場合は、$setValidityを使用して無効に設定する必要があります。このように：

dataService.getUsers().then(function(currentusers) { 
    console.log(currentusers) 
     //Ensure value that being checked hasn't changed 
     //since the Ajax call was made 
    if (currentValue == element.val()) { 
     currentusers.forEach(function(user) { 
     if (currentValue === user.property) { 
      ngModel.$setValidity('unique', false) 
     } 
     }); 
    } 
    }, function() { 
    //Probably want a more robust way to handle an error 
    //For this demo we'll set unique to true though 
    ngModel.$setValidity('unique', true); 
    }); 
}); 

また、サービスは毎回JSONを取得していました。また、角度サービス（これはシングルトン）内の変数にJSONレスポンスを格納することができますので、以前より速くなります。このように、

dataFactory.getUsers = function() { 
    var deferred = $q.defer() 
    if (angular.isDefined(savedResults)) { 
    deferred.resolve(savedResults.data); 
    return deferred.promise; 
    } else { 
    return $http.get(serviceBase).then(
     function(results) { 
     savedResults = results 
     return results.data; 
     }); 
    } 
}; 

ここでは、データがすでに利用可能である場合、解決済みの約束を返します。 JSONを初めて取得し、内部から使用します。

working plunker

Answer 2

あなたがnitesh@gmail.comを入力した場合、それはすでに使用中のメールを表示しますplnkr link

を確認してください。 nitesh@gmail.com1と入力すると、エラーメッセージは表示されません。 条件を変更しました。