javascript - 在 Angular 中实现 circliful jQuery 插件

Question

我正在尝试在我的 Angular 应用程序中实现 jQuery 插件“circliful”。

为了使圆图工作，我需要设置如下数据属性:

<div id="chart" data-text="30%" data-percent="30"></div>

在 JS 中:

$('#chart').circliful();

我的问题是将它与 Angular 指令集成。
HTML 存在于页面加载中，但稍后使用 $http 设置数据(并且可以多次更改)。

我尝试这样设置数据:

<div id="chart" data-text="{{mydata.text}}%" data-percent="{{mydata.num}}"></div>

我想指令可以在这里帮助我，但我不知道如何构建一个每次都会更新 data-text 和 data-percent 的指令范围数据更改？

Answer 1

在实现 Jquery Circliful 插件之前添加延迟。我也有同样的问题，在应用延迟后它起作用了。

延迟函数:

   var delay = ( function() {
        var timer = 0;
        return function(callback, ms) {
            clearTimeout (timer);
            timer = setTimeout(callback, ms);
        };
    })();

用法:

delay(function(){
    $('#chart').circliful();
}, 5000 );