javascript - 如何使用 $index 设置 angular ui bootstrap calendar is-open 属性？

Question

我正在使用 angular-ui bootstrap 来设置日历。我的问题是如何使用 $index 在 ngRepeat 迭代中设置 is-open 属性？如果设置都一样，当用户点击日历时，所有的日历都会弹出。但是

    is-open="newTestDateOpened + $index"

不起作用。那我该怎么做呢？然后在 setNewTestDate($event,$index) 函数中我可以将其设置为 true。

    <div ng-repeat='history in testingHistory'>
        <div class="row">
            <div class="col-sm-2">
                <p class="input-group">
                <input type="text" class="form-control" datepicker-popup="dd-MM-yyyy" ng-model="history.testingDate" is-open="newTestDateOpened + $index" max-date="maxDate" close-text="Close" />
                <span class="input-group-btn">
                  <button type="button" class="btn btn-default" ng-click="setNewTestDate($event,$index)"><i class="glyphicon glyphicon-calendar"></i></button>
                </span>
                </p>
            </div>
        </div>
    </div>

Answer 1

我自己想出了一个办法。对于那些有类似问题的人。

只需使用 JavaScript 对象。

is-open="existingTestDate['idx'+$index]"
    ... 
ng-click="setExistingTestDate($event,$index)"

然后在对应的js文件中。

$scope.existingTestDate = {};
$scope.setExistingTestDate = function($event,idx) {
    $event.preventDefault();
    $event.stopPropagation();

    $scope.existingTestDate['idx'+idx] = true;
};

通过这种方式，您可以在 ngRepeat 迭代中控制日历按钮。