execute Jquery code in AngularJS

0

I'm working with models and I have the following jQuery code:

$('.progress-bar').each(function(i,e){
    var $this = $(this);
    var $percent = $("<div class=\"percent\"></div>");
    var $value = $this.attr("data-value");
    $this.append($percent);

    $percent.css( {'background': $this.attr("data-color")});
    $percent.animate({width: $this.attr("data-percent") + '%'}, 350);

    if ($value != undefined && $value != "") {
        $divvalue = $("<span class=\"txt\">"+$value+"</span>");
        $this.append($divvalue);
        $divvalue.animate({'left': $this.attr("data-percent")+'%', opacity: 1});
    }
});

which I need to adapt to Angularjs. I am working with lists and ng-repeat as follows:

<table>
    <tr ng-repeat="internetPrincipal in internetListaBolsaPrincipalInternet">
        <td width="30%">{{internetPrincipal.nombreBolsa}}</td>
        <td>
            <div class="progress-bar" data-color="#d52b1e" data-percent="25" data-value="{{internetPrincipal.bolsaUtilizada}}" >
                <span>{{internetPrincipal.bolsaTotal - internetPrincipal.bolsaUtilizada}} {{internetPrincipal.unidadConsumo}} restantes</span>
            </div>
        </td>
        <td width="100">{{internetPrincipal.bolsaTotal}}{{internetPrincipal.unidadConsumo}}</td>
    </tr>
</table>

As you can see, the ng-repeat is executed and is generating td according to what the list brings. What I do not achieve is to give it the effect it had with jquery.

Some help I would appreciate.

    
asked by jose.luis.lopez 23.09.2016 в 22:58
source

0 answers