1

I am using UI Bootstrap's typeahead directive, and added my own popup template via typeahead-popup-template-url. In that template, I'd like to access scope variables from the parent template (i.e. the one in which I've used the typeahead directive). Is this possible?

Here's a (broken) example of what I'm trying to do ("hello" should be present in the dropdown): http://plnkr.co/edit/ITT1SdRfUWeeN6n3aMqu?p=preview

I'd like to do this WITHOUT modifying the typeahead directive. I don't want to muck around in third party (uib) code if there's a more elegant solution.

lakenen
  • 3,436
  • 5
  • 27
  • 39

2 Answers2

2

In your template, you need to reference the $parent scope. Change:

This should say "hello": {{hello}}</h1>

To:

This should say "hello": {{$parent.hello}}</h1>
Rob J
  • 6,609
  • 5
  • 28
  • 29
  • Thanks! I was hoping there'd be a simple solution. – lakenen Jan 11 '16 at 00:52
  • you might need to go up several parent scopes to get there. it took `$parent.$parent.$parent` for me https://stackoverflow.com/questions/18441928/access-controller-scope-from-bootstrap-ui-typeahead-template/31727911 – chiliNUT Sep 01 '23 at 20:34
0

Bootstrap, jquery ui, kendoui, yui etc Isn't that a bit much of frameworks together O.o

Anyway this post might help: How to access parent scope from within a custom directive *with own scope* in AngularJS?

Community
  • 1
  • 1
seahorsepip
  • 4,519
  • 1
  • 19
  • 30
  • Correct me if I'm wrong, but it seems like this would require modifying the uib directive code? See my question for clarification. Thanks! – lakenen Jan 10 '16 at 01:17
  • Maybe write a custom directive besides the original based on the original? Not too much experience with angular to know if that is possible and a good idea though. – seahorsepip Jan 10 '16 at 01:21