Disable Angular One-Form Form Validation (url)

I am creating an Angular form with a URL field that can be formatted with either the prefix (http: //) or without it. Using Angular to validate the URL by default requires http: //, so I hooked up the following regex, which accepts with and without a prefix:

<input type="text" id="siteAddress" name="siteAddress" ng-model="user.url" ng-pattern="/^(https?:\/\/)?([\dA-Za-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/" required>

This works fine, but when I set type = "url", the Angular check overwrites my custom ng template. This form is intended only for mobile users, therefore type = "url" is important for getting the correct keyboard, therefore their mobile OS does not try to auto-correct their input.

Is it possible to use type = "url" without Angular, using its default check, or is it possible to modify the default Angular check so that it does not accept the url prefix?

Thanks!

+4
source share
2 answers

There doesn't seem to be an official API for this, but you can always override the default directive or use your higher priority directive to change the standard behavior.

For example, the angular directive inputgets a type from an object $attributes, so you can remove this attribute.

directive('ignoreType', function() {
    return {
        priority: 500,
        compile: function(el, attrs) { 
            attrs.$set('type', 
                null,                //to delete type from attributes object
                false                //to preserve type attribute in DOM
            );
        }
    }
});

Here is the jsfiddle for it .

Of course, this solution may also violate the behavior of other directives that work with the type attribute, so use it carefully.

+3
source

, $removeControl FormController, , URL-... http://docs.angularjs.org/api/ng.directive:form.FormController

- :

    $scope.form.$removeControl('siteAddress');

, , , ... , .

, .

0

Source: https://habr.com/ru/post/1523825/


All Articles