javascript - Angular 范围和应用的 css 类仅在第一个 div 上

Question

我每 2 秒调用一次 js 函数，在某些情况下我想更新 View 上的 div。

 <div id="ball_{{ballIndex}}">{{ball}}</div>

在 ng Controller 上

       var myCounter = 0;

        var interval = $interval(function () {
            if (myCounter <= 35) {
                myCounter ++;
                DoSomething();
            } else {
                //
            }
        }, 1500);

        function setCurrentBallEffect() {
            $('#ball_' + myCounter).addClass('magictime puffIn');                
        }

        function DoSomething() {
            if (myCounter == 0) {
                $scope.ballIndex = 1;
            } else {
                $scope.ballIndex = myCounter;
            }
        }

使用此代码，仅迭代中的第一个 div 与类 magictime puffIn 一起应用。当我在 View 侧对 div id 进行硬编码时，如 <div id="ball_1">1</div> <div id="ball_2">2</div> ..在每个 div 上应用 css 类。我做错了什么？

更新: 尝试过

<div ng-attr-id="{{ 'ball_' + ballIndex }}"> </div>

但问题仍然存在。

Answer 1

首先您必须定义

var myCounter =0;

我不懂球

你必须这样定义它:

$scope.ball=0;

我像这样更改 View

<div id="ball_{{ballIndex}}">{{ballIndex}}</div>

你的 JavaScript 改变如下:

var poolCounter = 0;
    var myCounter = 0;

    var interval = $interval(function () {
        if (myCounter <= 35) {
            myCounter++;
            DoSomething();
        } else {
            //
        }
    }, 1500);

    function setCurrentBallEffect() {
        $('#ball_' + myCounter).addClass('magictime puffIn');
    }

    function DoSomething() {
        if (myCounter == 0) {
            $scope.ballIndex = 1;
        } else {
            $scope.ballIndex = myCounter;
        }
    }