Исключение при обертывании нокаутирующей привязки 'template' моей собственной привязкой

Я пытаюсь написать пользовательскую привязку на основе шаблона привязки. Идея состоит в том, чтобы иметь шаблон с собственным классом модели представления, но я не хочу добавлять экземпляры этого класса в модель родительского представления (по крайней мере, не в коде. Добавление экземпляров во время выполнения хорошо для меня).

Чтобы понять, что я пытаюсь достичь, вот пример: я хочу создать расширенный слайдер, я не хочу, чтобы HTML слайдера был в шаблоне, также слайдеру нужен собственный класс, но я не хочу добавлять экземпляр модели представления слайдера. в родительский вид модели. Вот мой код, сначала он работает и кажется, что сначала он отображает шаблон, но затем выдается исключение, и я не могу понять, почему. Посмотреть рабочий код здесь

HTML:

  <script type="text/html" id="my-template">  
    <div data-bind="text: internalValue"></div>
  </script>

  <div data-bind="templateWithModel: {name: 'my-template', dataPropName: 'price', modelConstructor: Slider}">
  </div>

ЯШ:

ko.bindingHandlers.templateWithModel = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext){
        var options = ko.utils.unwrapObservable(valueAccessor());
        var modelName = options.name + "_" + options.dataPropName;
        viewModel[modelName] = new options.modelConstructor(viewModel[options.dataPropName]);

        ko.bindingHandlers.template.init(element, valueAccessor);
    },
    'update': function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        var options = ko.utils.unwrapObservable(valueAccessor());
        var modelName = options.name + "_" + options.dataPropName;
        options.data = viewModel[modelName];

        ko.bindingHandlers.template.update(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext);
    }
}


var Slider = function(obsVal){
  var self = this;

  self.internalValue = ko.observable(obsVal());
}     

var vm = {price: ko.observable(5)};

ko.applyBindings(vm);
Источник

2 ответа

Решение

В вашем init функция, вы захотите вернуть значение ko.bindingHandlers.template.init или вернуться { controlsDescendantBindings: true },

Это говорит Knockout, что привязка позаботится о применении привязок к дочерним элементам. В противном случае Knockout продолжит применять привязки с общей моделью представления к дочерним элементам, что вызывает ваше исключение как internalValue не является свойством в модели представления верхнего уровня.

Эта часть документов: http://knockoutjs.com/documentation/custom-bindings-controlling-descendant-bindings.html и этот пост в блоге помогают объяснить controlsDescendantBindings далее: http://www.knockmeout.net/2012/05/quick-tip-skip-binding.html

Источник

Я сделал каркас для привязки моделей представления к шаблонам. Посмотри сюда,

https://github.com/AndersMalmgren/Knockout.BindingConventions/wiki/Template-convention

Он работает по соглашениям, так что если у вас есть член, который является моделью с именем MyViewModel тогда он будет искать шаблон с именем MyView

<div data-name="myMember"></div>

http://jsfiddle.net/xJL7u/

Источник
Другие вопросы по тегам