JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.9/angular.min.js"></script>
<!DOCTYPE html>
<html lang="en" ng-app="demo">
<head>
<meta charset="utf-8">
<title>AngularJS ui-validate</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.js"></script>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css"/>
<!-- ui-validate files -->
<script src="../dist/validate.js"></script>
</head>
<body class="container">
<script>
var app = angular.module('demo', ['ui.validate']);
app.controller('ValidateCtrl', function($scope, $timeout, $q) {
$scope.notBlackListed = function(value) {
var blacklist = ['[email protected]', '[email protected]'];
return blacklist.indexOf(value) === -1;
};
$scope.doesNotExist = function(value) {
var db = ['[email protected]', '[email protected]'];
// Simulates an asyncronous trip to the server.
return $q(function(resolve, reject) {
$timeout(function() {
if (db.indexOf(value) < 0) {
resolve();
} else {
reject();
}
}, 2000);
});
};
});
</script>
<section id="validate" ng-controller="ValidateCtrl">
<div class="page-header">
<h1>Validate</h1>
</div>
<h3>What?</h3>
<div class="row">
<div class="col-md-6">
<p>The
<code>ui-validate</code> and <code>ui-validate-async</code> directives makes it very easy to create custom validator expressions.</p>
...