I'm pretty new to angular and would appreciate some guidance. I'm trying to
recreate some functionality in our apps that is currently being
accomplished with jQuery. The functionality involves attaching a
pseudo-class to a textbox which is then picked up by jQuery and an image of
a magnifying glass is injected into the DOM immediately after the textbox.
Clicking on the image causes a dialog box to pop open.
What I've accomplished so far is a simple html page with a single textbox,
a simple controller that really does nothing yet, and a simple directive.
When the textbox has focus, the image appears after the textbox as
expected. However, the ng-click directive on the image does not fire. The
intention is for it to fire a function in the isolated scope. For now,
just to get the proof of concept working, I'd be happy if the function just
fired an alert.
A text file is attached with the contents of the directive. It's probably
something simple that's missing. Any guidance would be appreciated.
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
angular
.module('app')
.directive('userSearch', userSearch);
function userSearch($compile) {
return {
restrict: 'EAC',
require: 'ngModel',
scope: {
search : '&'
},
link: function (scope, element, attrs) {
element.bind('focus', function () {
var nextElement = element.parent().find('.openuserdialog').length;
if (nextElement == 0) {
var magnifyingglass = $compile('<img src="' + homePath +
'Images/zoomHS.png" ' +
'alt="User Search" ' +
'ng-click="pc.search("' + attrs.id +
'")" ' +
'class="openuserdialog">')(scope);
element.after(magnifyingglass);
}
});
}
};
};
