javascript - 用 ng Repeat 填充 tx3 标签云

Question

我正在使用 tx3 Tag Cloud 来可视化一些数据。 其实使用起来很简单。

<ul id="tagcloud">
<li data-weight="50"><a href="#">HTML5</a></li>
<li data-weight="24"><a href="#">CSS3</a></li>
<li data-weight="28"><a href="#">Javascript</a></li>
<li data-weight="32"><a href="#">jQuery</a></li>
...
</ul>

我想用 ngRepeat 从 Angular 范围列表中填充这些元素。

<li data-weight="{{element.weight}}" ng-repeat="element in list">{{element.title}}</li>

在 DevTools/Firebug 中，我可以看到创建了所有 li 元素，但忽略了数据权重。如果没有 ngRepeat，我可以看到带有大小值的样式属性将被添加到 li 元素中。对于 ngRepeat，情况并非如此。

我认为问题是在创建标签云时没有加载/初始化 Angular 范围。有没有办法强制在页面加载之前完全加载作用域？

提前致谢。

Answer 1

我通过向 ng-repeat 添加指令解决了我的问题。在此指令中，我调用超时函数并在之后初始化标签云。

function ngRepeatDoneNotification($timeout) {

        return {
            link: function(scope, element, attrs) {
                if (scope.$last){ // ISSUE IS HERE
                        $timeout(function() {
                        $("#tagcloud").tx3TagCloud({
                            multiplier: 5 // default multiplier is "1"
                        });
                    });
                }
            }
        }
    }