JSFiddle - React, Tailwind, and code Playground

by Bahman ParsaManesh

HTML

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>  
<body ng-app="myApp">

<p>Try writing in the input field:</p>

<form name="myForm">
<input name="myInput" ng-model="myInput" required my-directive>
</form>

<p>The input's valid state is:</p>
<h1>{{myForm.myInput.$valid}}</h1>

<script>
var app = angular.module('myApp', []);
app.directive('myDirective', function(mCtrl) {
    if (value.indexOf("e") > -1) {
        mCtrl.$setValidity('charE', true);
    } else {
        mCtrl.$setValidity('charE', false);
    }
    return value;
});
</script>

<p>The input field must contain the character "e" to be consider valid.</p>

</body>
</html>