Входные тексты вставляются в DOM с помощью итерируемого повтора, как показано ниже:
HTML:
<template repeat="value in listValue">
<input type="text" bind-value="listValue[$index]">
</template>
Дарт:
List listValue = toObservable(["value one", "value two"]);
Есть проблема с фокусом: при вводе буквы в любом из полей ввода DOM перерисовывается и фокус теряется. Это связано с ошибкой фокусировки.
Как я мог заставить это работать?
Проблема фокуса является результатом того, что WebUI в настоящее время рассматривает изменения отдельных записей в списке как общее изменение самого списка, поэтому он повторно отображает весь шаблон-повтор при каждом редактировании. Вы можете получить желаемое поведение, добавив один уровень косвенности. Идея состоит в том, чтобы упростить различение изменений значений и изменений в списке.
Например, вместо списка строковых значений сделайте его списком наблюдаемых ссылок на строковые значения, как показано ниже:
HTML:
<template repeat="value in listValue">
<input type="text" bind-value="value.value">
</template>
дротик:
import 'package:web_ui/web_ui.dart';
List listValue = toObservable([]);
void main() {
listValue.add(new ObservableReference("value one"));
listValue.add(new ObservableReference("value two"));
}
