javascript - Email Blacklist and verification -

i'm new angular , try make easy blacklist check. @ moment have 2 texts can show , hide ng-show. first 1 should shown when mail-pattern wrong , hidden when correct and/or on blacklist.

my problem don't have clue how model must implemented. @ moment simulated checkbox. maybe has hint.

<div class="controls">   <input type="checkbox" ng-model="checked" ng-init="checked=true" /><br/>   <input type="email" id="inputemail" placeholder="email" ng-model="email" required> <div class="hint">     <h4 name="mailvalidator" ng-if="checked" ng-show="true">invalid email</h4>     <h4 name="checkblacklist" ng-if="!checked" ng-show="true">email not allowed</h4> </div> 

here fiddle-demo

i create jsfiddle problem.

jsfiddle

view:

<div ng-controller="myctrl">      <input placeholder="email" ng-model="email" ng-pattern="emailregexp" ng-class="{ error: !email }" />      <h4 name="mailvalidator" ng-show="!email">invalid email</h4>      <h4 name="checkblacklist" ng-show="email && inblacklist">email not allowed</h4> </div> 

controller:

function myctrl($scope) {     $scope.inblacklist = false;      //get db in case     var bannedemail = ['qwe@qwe.qwe','qwe1@qwe.qwe','qwe2@qwe.qwe']      $scope.emailregexp = /^[a-za-z0-9._%+-]+@[a-za-z0-9.-]+\.[a-za-z]{2,4}$/;     $scope.$watch('email', function(newvalue) {        if(newvalue){            if(bannedemail.indexof(newvalue) > -1) {                $scope.inblacklist = true;            }            else {                $scope.inblacklist = false;            }        }    });       }