javascript - how to filter input value in AngularJS -
i'm trying implement filtering on input element. want make filtering input type="text" field. instance, if model contain more available characters want change input value. i've created jsfiddle have directive generate html template dynamically , contains input field.
var app = angular.module('app', []) .controller('ctrlr', function($scope){ $scope.mymodel = "test"; $scope.availablecharacters = 5; $scope.$watch('mymodel', function(newvalue, oldvalue){ if(!newvalue){ return; } if(newvalue.length > 5){ $scope.cutstring(); } }); $scope.cutstring = function(){ var length = $scope.mymodel.length; var string = $scope.mymodel.slice(0, $scope.availablecharacters); var countstars = length - string.length; $scope.mymodel = $scope.createstars(string, countstars); } $scope.createstars = function(string, countstars){ for(var = 1; <= countstars; i++){ string = string+'*'; } return string; } }) .directive('awesome' , function(){ return { restrict:'e', template:'<input type="text" ng-model="mymodel" ng-value="mymodel | filter:my" />' } })
could possibly move code filter function? have lot of business logic , don't want keep code in controller, because reusable directive.
i think implementing part of functionality filter not best idea.
it more dynamic if implement directive on input element like:
<input type="text" ng-model="mymodel" ng-value="mymodel" max-length="20" />
in case more flexible. able pass argument directive (for example length of acceptable value).
also not readable developers make input template of directive because of using model attribute of input field , not binding directive.
is there reason why use directive render simple input? if not, live input in view , add directive instead of filter work data checks limitations.
another approach implement custom form controls. allows control incoming , out-coming data.
here example documentation - implementing custom form controls (using ngmodel)
Comments
Post a Comment