Menu icon Foundation
How to get tooltips working with AngularJS ng-repeat?

Here is a little app I've written that uses AngularJS and styled with Foundation.

http://dev.golightlyplus.com/bitcoin/arbitrage/

If you click "View the latest 10 asks" on the left, it'll reveal a table.

The idea is to display a different value in a tooltip for the numbers.

In the column entitled "1 BTC value" the tooltip shows but with no value if I put in an AngularJS expression.

So for the final column I tried using a directive instead. However, no tooltip shows.

I did come across http://pineconellc.github.io/angular-foundation/ and wonder if it's better to use for AngularJS? Is this relevant at all to this example issue?

Thanks.

<tr ng-repeat="btcAsk in latestAsksFromBcId | limitTo:10">
    <td>{{$index + 1}}</td>
    <td><span data-tooltip class="has-tip" title="{{btcAsk.btcValue}}">{{btcAsk.btcValue}}</span></td>
    <td running-total currIndex="{{$index}}" tooltip="bobo">{{btcAsk.btcAmnt}}</td>
    <td currency-convert idrVal="{{(btcAsk.btcValue * btcAsk.btcAmnt).toFixed(2)}}"></td>
</tr>
            

// perform a currency conversion from IDR to USD on mouse rollover
bitcoinApp.directive("currencyConvert", function(CurrencyConversions) {
    return {
        restrict: 'A',
        scope: {
            idrval: '@'
        },
        template: '<span data-tooltip class="has-tip" title="USD val">{{idrval}}</span>'
    };
});

AngularJS

Here is a little app I've written that uses AngularJS and styled with Foundation.

http://dev.golightlyplus.com/bitcoin/arbitrage/

If you click "View the latest 10 asks" on the left, it'll reveal a table.

The idea is to display a different value in a tooltip for the numbers.

In the column entitled "1 BTC value" the tooltip shows but with no value if I put in an AngularJS expression.

So for the final column I tried using a directive instead. However, no tooltip shows.

I did come across http://pineconellc.github.io/angular-foundation/ and wonder if it's better to use for AngularJS? Is this relevant at all to this example issue?

Thanks.

<tr ng-repeat="btcAsk in latestAsksFromBcId | limitTo:10">
    <td>{{$index + 1}}</td>
    <td><span data-tooltip class="has-tip" title="{{btcAsk.btcValue}}">{{btcAsk.btcValue}}</span></td>
    <td running-total currIndex="{{$index}}" tooltip="bobo">{{btcAsk.btcAmnt}}</td>
    <td currency-convert idrVal="{{(btcAsk.btcValue * btcAsk.btcAmnt).toFixed(2)}}"></td>
</tr>
            

// perform a currency conversion from IDR to USD on mouse rollover
bitcoinApp.directive("currencyConvert", function(CurrencyConversions) {
    return {
        restrict: 'A',
        scope: {
            idrval: '@'
        },
        template: '<span data-tooltip class="has-tip" title="USD val">{{idrval}}</span>'
    };
});
Ronen Mars over 3 years ago

Same problem here...

clickerheroes1 over 1 year ago

"View the latest 10 asks" happy wheels (y)

Edward Moore 6 days ago

Some of the programing is always required which can help to make the money through the casino games.I have checked about the https://casinosapproved.info/bitcoin-casino-canada/  site which provides the best toolkit details of the games and this can also provide the best option for making the money in simple way as well.Players want to know about the casino games which are best option for making money.