Question

我创建了一个函数delay（），以获得动画的随机延迟数，一切正常，但在控制台中我得到这个无限循环错误：[$ rootScope：infdig]。我想设置delay（）迭代次数=工作记录号，我该怎么做？

HTML：

<div id="work" class="work" ng-controller="WorkCtrl">
<ul class="grid">
    <li class="wow zoomIn" data-wow-delay="0.{{ delay() }}s" ng-repeat="w in work | orderBy:'id':true">
        <a href="{{ w.link }}" target="blank_">
            <div class="background"></div>
            <h3 class="name">{{ w.name }}</h3>
            <p class="description">{{ w.description }}</p>
            <img ng-src="{{ w.image_path }}">
        </a>
    </li>
</ul>

JS：

var app = angular.module("portfolio", []);
app.controller('WorkCtrl', function($scope, $http) {

    $http.get('work.json').success(function(work) {

        $scope.work = work;

    });

    $scope.delay = function(minNum, maxNum) {
        minNum = 0;
        maxNum = 5;
        return (Math.floor(Math.random()*(maxNum - minNum + 1)) + minNum);
    };

});

Answer 1

谢谢Blazemonger，我写了一个带有额外属性延迟的新数组，现在它就像一个没有错误的魅力。

<强> HTML：

<div id="work" class="work" ng-controller="WorkCtrl">
    <ul class="grid">
        <li class="wow zoomIn" data-wow-delay="0.{{ w.delay() }}s" ng-repeat="w in workList | orderBy:'item.id':true">
            <a href="{{ w.item.link }}" target="blank_">
                <div class="background"></div>
                <h3 class="name">{{ w.item.name }}</h3>
                <p class="description">{{ w.item.description }}</p>
                <img ng-src="{{ w.item.image_path }}">
            </a>
        </li>
    </ul>
</div>

<强> JS：

$scope.workList = [];

angular.forEach($scope.work, function(item) {
    minNum = 0;
    maxNum = 5;
    $scope.workList.push({
        item: item,
        delay: (Math.floor(Math.random()*(maxNum - minNum + 1)) + minNum)
    });
});

无限循环错误：[$ rootScope：infdig]

1 个答案: