Why directive not working in ionic, but it works in angular

I have created a input clear directive to clear input field, but its not working in ionic, same code is working fine in angular fiddle.

Here is angular demo
Here is ionic demo

My template in ionic look like this

<ion-list> <label class="item item-input" input-clear > <input type="text" ng-model="user.email" placeholder="{{ 'LOGIN.EMAIL_ID' | translate }}"> </label> </ion-list>

and controller

.controller('forgotPasswordCtrl', function($scope) { $scope.user = {}; });

I have also faced similar issue here http://stackoverflow.com/questions/35006824/why-scope-is-not-updating-once-changed-by-directive-in-ionic

Please help

You need to post the code of your controller as well to be able to determine what’s wrong. The fiddle doesn’t work by the way, the label needs a “wf-input-clear” attribute instead of “input-clear”

I have updated the demo link, I don’t have anything in controller, just plain scope

.controller('forgotPasswordCtrl', function($scope) { $scope.user = {}; });

Because the directive is looking for a different attribute to the one you posted in the template. It looks for input-clear but your template provided above uses wf-input-clear

Tried it in a project I’m working on and it works fine there. Added it to the app.js and then added the input-clear directive to the label. This is the piece from my template:


How did you include this directive in your project?

Sorry, It was a typo, I have used directive as input-clear and its showing and hiding the button when i type in this field, but ng-click never fires.

I think its due to <ion-list> which is causing click event not to fire.

Everything is already in app.directives dependency, its working but only the click event is not firing. Trying putting it inside an <ion-list> and see, it will not fire click event

I have made a codepen to demonstrate the click event problem

Strange. I have no clue why the ng-click doesn’t work. Changing ng-click to on-touch makes it work though.