javascriptangularjsangular-ui

How to validate an IP in a text field AngularJS


How to validate an IP in a textfield in AngularJS ? Currently I am using this code, but its not working in all cases . Any idea ?

ng-pattern='/^((([01]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))[.]){3}(([0-1]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))$/


Solution

  • Use:

    /\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b/
    

    Matches 0.0.0.0 through 255.255.255.255

    If you want to drop 0.0.0.0 and255.255.255.255 I suggest you to add additional if statement. Otherwise the regex will be too complicated.

    Example with watcher:

    $scope.ip = '1.2.3.4';
    
        $scope.$watch(function () {
            return $scope.ip;
        },
    
        function (newVal, oldVal) {            
            if (
                newVal != '0.0.0.0' && newVal != '255.255.255.255' &&
                newVal.match(/\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b/))
            {
                 // Match attempt succeeded
            } else {
                // Match attempt failed
            }
        })
    

    Demo Fiddle

    [Edit]

    The best bet is to create directive, something like: <ip-input>

    This example might helpful how to create directive for custom input: format-input-value-in-angularjs