AngularJS - utiliser le champ de saisie en tant que fiter et comme champ de saisie en même temps

Question

J'ai une page avec la liste des emails et j'ai un champ de saisie là, qui a 2 buts: - Filtrer la liste des amis - Si aucun ami avec cet e-mail trouvé - faire le bouton Ajouter ami disponible pour envoyer une demande d'amitié

Le problème est que je suis une validation sur ce domaine et quand je suis en train de faire une recherche, le système applique ng- motif, donc, si je suis arrivé email aa@aa.aa sur une liste, le filtre trouverez seulement avec texte aa@aa.aa, pas avec aa (comme sans ng-modèle).

Je ne veux pas utiliser 2 champs pour cela, donc, y a-t-il des solutions de contournement?

code:

<td> 
    <input type="text" id="email" name="email" ng-model="searchForFriend" 
    ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/" 
    ng-minlength="3" ng-maxlength="100" required placeholder="Your friend e-mail" 
    ng-blur="focused1 = false" ng-focus="focused1 = true" /> 
    <span ng-show="focused1 && !friendsForm.email.$valid"><error><br>E-mail is incorrect</error></span> 
    <span ng-show="focused1 && friendsForm.email.$error.maxlength"><error><br>E-mail is too long</error></span> 
    <input type="button" id="sendRequest" value="Send Request" ng-click="saveContact()" ng-disabled="!friendsForm.$valid && !friendsForm.contactsAmount.length" class="btn btn-primary"/> 
</td> 
..... 
<tr ng-repeat="contact in friends|filter:searchForFriend|filter:{id_dictionary:'2'} as contactsAmount"> 
    <td align="left">{{ contact.email }}</td> 
</tr> 

Answer 1

Basé sur le commentaire de @JBNizet -

<input type="text" id="email" name="email" ng-model="searchForFriend" 
ng-pattern="/^[_a-z0-9]+(\.[_a-z0-9]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/" 
ng-minlength="3" ng-maxlength="100" required placeholder="Your friend e-mail" 
ng-blur="focused1 = false" ng-focus="focused1 = true" 
ng-model-options="{allowInvalid: true}"/> 
<span ng-show="focused1 && !friendsForm.email.$valid"><error><br>E-mail is incorrect</error></span> 
<span ng-show="focused1 && friendsForm.email.$error.maxlength"><error><br>E-mail is too long</error></span> 
<input type="text" placeholder="Search for Friend" ng-model="searchForFriend" style = "width:99%;">