1

Nb. This question is similar to a related question which refers to compiling the content within a directive.

However, this example is slightly different, in the example this is targeted to, the qtip elements are related to cytoscape objects using the cytoscape-qtip plugin, not plain html elements. As such, I need a way to either compile the html from a controller/service, or refer to a directive from there.

Qtip allows you to have HTML as the text body of the qtip, which makes it ideal for creating onclick dialog menus, etc.

For example I can do this:

<body  ng-controller = "MyController" ng-app="myApp" ng-class = "bodyStyle">

    <a href ="" id = "foo" > Foo</a><br>
    <a href ="" id = "bar" > Bar</a><br>
    <a href ="" id = "biz"> Biz</a><br>

</body>

<script>

$('a').qtip(
     {
         content: {
             text: '<button onclick = "console.log(\'foo\');">click me</button><br> foofoo',
             title: {
                 text: 'My Qtip',
                 button: true
             }
         }
     });
</script>

enter image description here

Where clicking on the Foo/Bar/Biz links will reveal the qtip, and then clicking the qtip's button will output to console.

What I would like to do is have this qtip bind to an angular controller. I can then access other services etc to carry out the correct ng-click functionality.

What's the most elegant way to do this?

dwjohnston
  • 11,163
  • 32
  • 99
  • 194
  • Could you open a jsfiddle? My guess is that you can $compile the HTML text you are providing for the qtip. – Oliver Jan 04 '16 at 21:23
  • Possible duplicate of [AngularJS binding jQuery qTip2 plugin](http://stackoverflow.com/questions/17934315/angularjs-binding-jquery-qtip2-plugin) – dwjohnston Jan 05 '16 at 01:17
  • @Oliver - Compile looks like the correct way to do it as per the linked answer. However for my scenario this doesn't work, as I'm not actually doing this within an angular directive (it's actually a qtip generated using the [cytoscape qtip plug in](https://github.com/cytoscape/cytoscape.js-qtip)). – dwjohnston Jan 05 '16 at 01:33

0 Answers0