How to get input data from text box in angularJS

Question

I have this piece of HTML(JSP) code to input phone number !! on which JQuery has been applied to check the validity of input text by user.

<input type="text" maxlength="20" value="" id="phone" autocomplete="off" name="mobileNumberField" class="a-input-text a-width-medium a-spacing-small textbox" data-ng-model="mobile_number.value " data-ng-required="true" required="required" placeholder="mobile_number.value_def">

So suppose text in input box is +91 9056 6783 32

when i print data in controller using $scope.mobile_number.value sometimes i get output like : undefined or +91 or +91 9056

i don't get complete input text !! How to i get complete input text in controller??

Answer 1

In Controller you can first declare an object $scope.mobile_number={}

    mainApp.controller('testApp', function($scope) {
               $scope.mobile_number={};
               $scope.mobile_number.value ="";
               $scope.$watch('mobile_number.value', function() {
               // do something here
               console.log($scope.mobile_number.value);
    });
});

Answer 2

Try to store your number as long datatype, rather than using a string.

To correctly display phone numbers in human-readable format, make use of angular-input-masks . The project is under MIT license. So feel free to modify the format to your liking.

Plunker is here: http://plnkr.co/edit/p3yFhsNwRO0v4kC915xF?p=preview

Dependency inject ui.utils.masks to your project.

Javscript:

var app = angular.module("app", ['ui.utils.masks']);

HTML:

<input ui-us-phone-number type="text" ng-model="myPhoneNumber" />

Answer 3

我尝试了类似的代码，但没有遇到任何问题。我在控制器中获取了完整的编号。