0

So, I'm looking to use ui.bootstrap.tooltip to appear when an element in a form is invalid.

I'm using a directive to do this - it's a bit ugly, but it works. Except for one thing - the controller isn't seeing the updated model values due to another scope being created in the directive.

I can get the model value through the form and using $viewValue, but this seems a bit "unclean" to me.

Also, is there a better way to get the "tooltip element", that I'm using elem.parent().children()[2]; for? I suppose I could create a <template> in the directive for all this.

The JSFiddle is at: http://jsfiddle.net/n8vNw/2/

Improve this question
3

1 Answer 1

Reset to default
1

You have created a parser function but never return a value from it. A parser function is used to parse the input value before it ends up in your model. Since a value never is returned, $scope.email will always be undefined.

Secondly there's no reason for your directive to create an isolated scope since you don't use that anyway, unless you're not showing us all the code--in such case us the $parse service instead.

Regarding how you access the tooltip element, perhaps let your formTooltipError directive create and add the element using the $compile service. (I haven't used Angular Bootstrap so there might be an easier/better answer.)

Updated fiddle.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

There isn't a need for an isolated scope, but my understanding was that one was created when I included ngModel in the directive. Thanks!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.