Как расширить нокаут наблюдаемых для чтения значения по умолчанию из привязки?

Наконец-то я нашел время, чтобы начать изучение KnockoutJS при создании нового приложения MVC4. Я пытаюсь найти лучший способ инициализировать наблюдаемое значение из значения по умолчанию, которое уже установлено в представлении.

Это надуманный пример, но я хотел бы отобразить значение по умолчанию для наблюдаемого непосредственно для представления следующим образом:

<input type="hidden" 
       value="@Model.SomeValue"
       data-bind="value: myObservableReference"/>

Я знаю, что значение по умолчанию обычно инициализируется с помощью:

model.myObservableReference = ko.obervable("SomeValue");

Однако мне хотелось бы найти способ продлить инициализацию таким образом, чтобы:

model.myObservableReference = ko.obervable();

будет читать существующее значение из привязки, если существует значение.

Как мне до сих пор удалось сохранить мой код KnockoutJS совершенно не осведомленным о мире бритвы, я хочу избежать неряшливости:

model.myObservableReference = ko.obervable(@Model.SomeValue);

Я предполагаю, что это будет обработано либо с помощью расширителя, либо с помощью специального связующего, но если кто-то может указать мне в правильном направлении, это будет очень признательно.

Ответы

Ответ 1

Для этого вы можете попробовать создать свой собственный обработчик привязки:

ko.bindingHandlers.initializeValue = {
    init: function(element, valueAccessor) {
        valueAccessor()(element.getAttribute('value'));
    },
    update: function(element, valueAccessor) {
        var value = valueAccessor();
        element.setAttribute('value', ko.utils.unwrapObservable(value))
    }
};

<input type="hidden" value="@Model.SomeValue"
       data-bind="initializeValue:myObservableReference, value: myObservableReference"/>

Ответ 2

Для вас googlers там, вот код, чтобы расширить привязку initializeValue к блоку выбора, а также поля ввода

ko.bindingHandlers.initializeValue = {
    init: function(element, valueAccessor) {
        if (element.getAttribute('value')) {
            valueAccessor()(element.getAttribute('value'));
        } else if (element.tagName === 'SELECT') {
            valueAccessor()(element.options[element.selectedIndex].value);
        }
    },
    update: function(element, valueAccessor) {
        var value = valueAccessor();
        element.setAttribute('value', ko.utils.unwrapObservable(value));
    }
}

ПРИМЕЧАНИЕ. Связывание initializeValue должно появиться перед привязкой значения в выбранном атрибуте привязки данных или он не будет работать.

<select data-bind='initializeValue: layout_id, value: layout_id, options: layouts, optionsText: "text", optionsValue: "id"'></select>