using ng-mask for phone

2019-07-28 19:47发布

问题:

I still have doubt in using ng-mask, I went through most of the web pages for it to work but it still remains the same. And many people told to use it with input tag of angularjs, after doing so Im not able to mask the input.Or am I making mistake please somebody correct me and give the clarity of using the ng-mask.

    <input type="tel" name="phoneno" maxlength=13  ng-model="phone.number" ng-mask="(999)999-9999"/>
    </div>          
<button class="button2" ng-click="home()">Back</button> &nbsp &nbsp &nbsp
<button class="button3" ng-click="addphone()">Add</button>

回答1:

Download the ngMask.min.js from net

Call the ngMask.min.js before app.js and Include app.js module

var yourApp= angular.module("yourApp", [
'ngMask'
]);

HTML :

<input type="tel" name="phoneno" maxlength=13 ng-model="phone.number" mask="(999)999-9999" />


回答2:

Below code is working for me.

I think you should use data-on attribute like below

<input type="text" class="form-control input-small" data-ng-model="zipcode" placeholder="Enter the zip code" data-ng-mask="#####-###" data-on="keyup">


回答3:

// 2. Add ngMask module dependency to your app.
angular.module('yourApp', ['ngMask']);
<!-- 1. Add ngMask plugin after your AngularJS. -->
<script src="angular.min.js"></script>
<script src='ngMask.min.js'></script>

<!-- 3. Use the avaiable patterns to create your mask. Set the mask attribute. -->
<input type='text' ng-model='maskModel' mask='39/19/9999' />

<!-- 4. Adjust your mask options. -->
<input type='text' ng-model='maskModel' ng-value='0/3/9' mask='3/9?' mask-repeat='2' mask-restrict='accept' mask-clean='true' mask-validate='false' mask-limit='false' />

source: https://github.com/candreoliveira/ngMask/blob/master/README.md



回答4:

Use ui-mask instead:

<div class="form-group">
<label for="birth-date">Date of birth</label>
<input type="text"
class="form-control"
id="birth-date"
ng-model="formData.date_of_birth"
ng-value="formData.date_of_birth"
ui-mask="99.99.9999"  
ui-mask-placeholder 
ui-mask-placeholder-char="_"
>
 </div>

https://github.com/angular-ui/ui-mask