i know how without controller as:
html
let's assume have directive named nguppercase(either true or false)
<div ng-controller="mycontrol" > <input type="text" ng-upper-case="isgiant" > </div>
js
myapp.directive('nguppercase',function(){ return{ restrict:'a', priority:0, link:function($scope,element,attr){ //---to retrieve value var val = $scope[attr.nguppercase]; var anotherval = $scope.$eval(attr.nguppercase); $scope.$watch(attr.nguppercase,function(val){ //---to watch }) } }; })
how make directive if i'm using this?
<div ng-controller="mycontrol ctl" > <input type="text" ng-upper-case="ctl.isgiant" > </div>
since it's not clear want achieve, here example of doing understand need: changing input value upper or lower case depending on variable:
function nguppercase() { return{ restrict:'a', priority:0, link:function($scope,element,attr){ //---to retrieve value var val = $scope[attr.nguppercase]; var anotherval = $scope.$eval(attr.nguppercase); $scope.$watch(attr.nguppercase,function(val){ if(val) { element[0].value = element[0].value.touppercase(); } else { element[0].value = element[0].value.tolowercase(); } }) } } } function mycontroller() { this.isgiant = true; } angular.module('myapp', []); angular .module('myapp') .controller('mycontroller', mycontroller) .directive('nguppercase', nguppercase);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> <div ng-app="myapp"> <div ng-controller="mycontroller ctl" > <a href="" ng-click="ctl.isgiant = false">lower case</a><br> <a href="" ng-click="ctl.isgiant = true">upper case</a> <input type="text" ng-upper-case="ctl.isgiant" value="testing123" > </div> </div>
Comments
Post a Comment