Я использую синтаксис управления потоком без контейнеров для того, должен ли я показывать элемент в списке выбора, когда пользователь переходит к редактирующему модалю. Кажется, у меня проблемы с IE8, чтобы заставить это работать. Из того, что я читал, IE8 выделяет комментарии в select. Отлично.
Параметры, которые я вижу
Есть ли способ заставить это работать с перекрестным браузером, не требуя дополнительного вызова службы для окончательного списка?
Вот мой код для выбранного списка
<tr>
<td><label for="EditStatus">Status</label></td>
<td><select id="EditStatus" class="" name="EditStatus" data-bind="value: editStatus" >
<option value="" selected>Select...</option>
<!-- ko if: editStatusCanShowActive() -->
<option value="A">Active</option>
<!-- /ko -->
<!-- ko if: editStatusCanShowInactive() -->
<option value="I">Inactive</option>
<!-- /ko -->
<!-- ko if: editStatusCanShowHold() -->
<option value="H">Hold</option>
<!-- /ko -->
<!-- ko if: editStatusCanShowLocked() -->
<option value="L">Locked</option>
<!-- /ko -->
</select></td>
</tr>
Один из вариантов - создать список в вашей модели просмотра, например:
this.availableStatuses = ko.computed(function() {
var statuses = [];
if (this.editStatusCanShowActive()) {
statuses.push({ name: "Active", value: "A" });
}
if (this.editStatusCanShowInactive()) {
statuses.push({ name: "Inactive", value: "I" });
}
if (this.editStatusCanShowHold)) {
statuses.push({ name: "Hold", value: "H" });
}
if (this.editStatusCanShowLocked()) {
statuses.push({ name: "Locked", value: "I" });
}
return statuses;
}, this);
Затем привяжите в своем интерфейсе, как:
<select data-bind="options: availableStatuses, optionsText: 'name', optionsValue: 'value', value: editStatus"></select>
Есть другой, лучший вариант. Используйте вычисленный наблюдаемый для создания массива параметров, например:
this.status = ko.computed(function() {
var options = [];
if (this.editStatusCanShowActive()) {
options.push('Active');
}
if (this.editStatusCanShowInactive()) {
options.push('Inactive');
}
if (this.editStatusCanShowHold()) {
options.push('Hold');
}
if (this.editStatusCanShowLocked()) {
options.push('Locked');
}
return options;
}, this);
Вот пример этой работы: http://jsfiddle.net/badsyntax/8FvMR/