如何在 ng-repeat 间隔中应用数组中新添加的对象？

Question

假设如下场景：先点击cont!按钮，然后点击add!，如何在计数函数中应用数组中新推入的对象，使其显示在[=14中的最后一个] =]?

更新工作示例：

var app = angular.module('app', []);
app.controller('homeCtrl', function($scope, $interval) {
  $scope.tabs = [{
    name: "one",
    active: true
  }, {
    name: "two",
    active: false
  }, {
    name: "three",
    active: false
  }];
  $scope.add = function() {
    $scope.tabs.push({
      name: "display me in the counter",
      active: false
    });
  };
  $scope.count = function() {
    var i = 0;
    var interval;

    $interval.cancel(interval);
    interval = $interval(function() {

      i = i % $scope.tabs.length;
      $scope.tabs[i].active = false;
      i++
      $scope.tabs[i].active = true;
      console.log($scope.tabs.length, i)
      if (!($scope.tabs.length - 1 > i)) $interval.cancel(interval);
    }, 2000);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" />

<div ng-app="app">
  <div ng-controller="homeCtrl">
    {{tabs}}
    <br>
    <button ng-click="add()" class="btn btn-default">add!</button>

    <button ng-click="count()" class="btn btn-default">count!</button>

    <div ng-repeat="no in tabs" ng-show="no.active" ng-bind="no.name">
    </div>

  </div>
</div>

Answer 1

当前您调用 $interval 服务时正在兑现 $scope.tabs.length。

如果你想显示在你调用 count 之后添加的项目，你必须在你的间隔函数中检查数组长度，比如：

interval = $interval(function() {
  if ($scope.tabs.length-1 > i) {
   ...
  } else {
   $interval.cancel(interval);
  }

}, 2000);

如何在 ng-repeat 间隔中应用数组中新添加的对象？

How to apply newly added object in array in ng-repeat interval?

javascript

intervals

angularjs