angular-mask
Version:
Personalized input masks for AngularJS
52 lines (49 loc) • 1.58 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Time Spec</title>
<script src="/bower_components/angular/angular.min.js"></script>
<script src="/releases/angular-input-masks.js"></script>
<script>
angular.module('timeTest', ['ui.utils.masks']);
function ctrl($scope) {
$scope.initializedTimeMask = '14:30:00';
$scope.initializedShortTimeMask = '14:30';
}
</script>
</head>
<body ng-app="timeTest">
<form name="form" ng-controller="ctrl">
<h2>ui-time-mask</h2>
<h3>default mode ("HH:MM:SS")</h3>
<input type="text" name="timeMaskInput" ng-model="timeMask" ui-time-mask>
<br>
ModelValue: <span ng-bind="timeMask"></span>
<br>
Errors: <span ng-bind="form.timeMaskInput.$error | json"></span>
<br>
<br>
<input type="text" name="initializedTimeMask" ng-model="initializedTimeMask" ui-time-mask>
<br>
ModelValue: <span ng-bind="initializedTimeMask"></span>
<br>
Errors: <span ng-bind="form.initializedTimeMask.$error | json"></span>
<br>
<h3>short mode ("HH:MM")</h3>
<input type="text" name="shortTimeMaskInput" ng-model="shortTimeMask" ui-time-mask="short">
<br>
ModelValue: <span ng-bind="shortTimeMask"></span>
<br>
Errors: <span ng-bind="form.shortTimeMaskInput.$error | json"></span>
<br>
<br>
<input type="text" name="initializedShortTimeMask" ng-model="initializedShortTimeMask" ui-time-mask="short">
<br>
ModelValue: <span ng-bind="initializedShortTimeMask"></span>
<br>
Errors: <span ng-bind="form.initializedShortTimeMask.$error | json"></span>
<br>
</form>
</body>
</html>