Masks in AngularJS

Question

Masks in AngularJS

Navigation

#1 by (1 votes)

1

I'd like to know how to use angular-input-masks . I did all the steps said in it, but I could not make it work.

I'm using AngularJS, here is my index page.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>CEP Spec</title>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script><scriptsrc="../node_modules/angular-input-masks/releases/angular-input-masks-dependencies.js"></script>
	<script src="../node_modules/angular-input-masks/releases/angular-input-masks.br.js"></script>
	<script>
		angular.module('app', ['ui.utils.masks']);
	</script>
</head>
<body ng-app="app">
	<form name="form" ng-controller="ctrl">
		<h2>ui-br-cep-mask</h2>
		<input type="text" name="field17" ng-model="initializedCep" ui-br-cep-mask><br>
		<span ng-bind="initializedCep"></span> - {{form.field17.$error}}<br>
		<br>
		<input type="text" name="field18" ng-model="cep" ng-model-options="{allowInvalid:true}" ui-br-cep-mask><br>
		<span ng-bind="cep"></span> - {{form.field18.$error}}<br>
		<br>
	</form>
</body>
</html>

angularjs mask

asked by anonymous 09.04.2018 / 08:33

1 answer

Ebit banner with 404 error and infinite loop with adblock on How to center text in a MessageBox?

score 1 · Accepted Answer

To use in your browser, you must execute the command:

npm run build

will create a directory in the project root named releases that will contain a file probably named angular-input-masks-standalone.min.js . You should remove the rows:

<script src="../node_modules/angular-input-masks/releases/angular-input-masks-dependencies.js"></script>
<script src="../node_modules/angular-input-masks/releases/angular-input-masks.br.js"></script>

And import the generated file:

<script src="angular-input-masks-standalone.min.js"></script>

Or just import directly from the NPM :

<script src="https://unpkg.com/[email protected]/releases/angular-input-masks-standalone.min.js"></script>

Seeworking

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.min.js"></script><scriptsrc="https://unpkg.com/[email protected]/releases/angular-input-masks-standalone.min.js"></script>
<script src="https://unpkg.com/[email protected]/br.js"></script><script>varapp=angular.module('app',['ui.utils.masks']);app.controller('ctrl',function($scope){$scope.percentage=0.45;});</script><divng-app="app">
  <form name="form" ng-controller="ctrl">
    <h2>ui-br-cep-mask</h2>
    <input type="text" name="field17" ng-model="initializedCep" ui-br-cep-mask><br>
    <span ng-bind="initializedCep"></span> - {{form.field17.$error}}<br>
    <br>
    <input type="text" name="field18" ng-model="cep" ng-model-options="{allowInvalid:true}" ui-br-cep-mask><br>
    <span ng-bind="cep"></span> - {{form.field18.$error}}<br>
    <br>
    <input type="text" name="field" ng-model="percentage" ui-percentage-mask>
  </form>
</div>