ng-repeat执行强制输入失去焦点

Question

我有一个使用ng-repeat创建的输入

    <div data-ng-repeat="(index, answer) in currentQuestion['possible_answers']" class="form-group">
        <label class="col-md-3 control-label">Answer {{ index + 1 }}</label>
        <div class="col-md-8">
            <div class="input-icon">
                <i class="fa fa-sun-o"></i>
                <input data-ng-model="currentQuestion['possible_answers'][index]" type="text" class="form-control" >
            </div>
        </div>
    </div>

我希望这用输入值预先填充输入,currentQuestion['possible_answers']我也希望任何更改都绑定到这个变量.

但是,每次我开始输入其中一个文本字段时,我键入一个字母然后它会丢失输入框的焦点.我有一种感觉,这是因为我开始输入和数据出价更新currentQuestion.因为currentQuestion已更新,所以ng-repeat再次执行.

有没有办法让ng-repeat行动成为一次性行动而不是不断重新评估？

Answer 1

是(查看症状,您没有向我们展示数据)您的问题可能是因为您的模型是您(可能有)数组中的文本,因此每当您更新模型时,它将触发摘要循环,因为ng-重复由文本跟踪.您可以通过提供轻松解决此问题.track by $index,以便观察ng-repeat并重复监视仅在阵列长度变化时才更新.

 <div data-ng-repeat="answer in currentQuestion['possible_answers'] track by $index" class="form-group">
    <label class="col-md-3 control-label">Answer {{ $index + 1 }}</label>
    <div class="col-md-8">
        <div class="input-icon">
            <i class="fa fa-sun-o"></i>
            <input data-ng-model="currentQuestion['possible_answers'][$index]" type="text" class="form-control" >
        </div>
    </div>
</div>

演示

您还可以使用$index获取数组的索引.你不需要迭代(key, value).

但是我只是让我的答案数组成为一个对象数组并摆脱所有这些问题,它只会(_note使用$index和ng-model): -

<div data-ng-repeat="answer in currentQuestion['possible_answers'] track by $index" class="form-group">
    <label class="col-md-3 control-label">Answer {{ $index + 1 }}</label>
    <div class="col-md-8">
        <div class="input-icon">
            <i class="fa fa-sun-o"></i>
            <input data-ng-model="answer.text" type="text" class="form-control" >
        </div>
    </div>
</div>

演示