Monday, 15 June 2015

javascript - How to create a custom input type? -



javascript - How to create a custom input type? -

i create custom input type similar way angularjs implements "email", example.

<input type="email" ng-model="user.email" />

what create input type this:

<input type="path" ng-model="page.path" />

any ideas on how can accomplished? far, i've been able figure out how implement custom directives 'path' name of tag, attribute or class.

for example, can work inconsistent other form fields , i'd them same.

<input type="text" ng-model="page.path" path /> app.directive('path', function() { homecoming { require: 'ngmodel', link: function(scope, elm, attrs, ctrl) { ... } }; });

you can create own input type="path" creating input directive custom logic if type attribute set "path".

i've created simple illustration replaces \ /. directive looks this:

module.directive('input', function() { homecoming { restrict: 'e', require: 'ngmodel', link: function (scope, element, attr, ngmodel) { if (attr.type !== 'path') return; // override input event , add together custom 'path' logic element.unbind('input'); element.bind('input', function () { var path = this.value.replace(/\\/g, '/'); scope.$apply(function () { ngmodel.$setviewvalue(path); }); }); } }; });

example

update: changed on, off bind, unbind remove jquery dependency. illustration updated.

javascript angularjs angularjs-directive

No comments:

Post a Comment