对象文字中的自定义敲除绑定

Question

how can i implement multiple custom knockout bindings that can be declared in an object literal?

basically instead of doing this:

 <input data-bind="customBinding1:observable1, customBinding2: observable2 }" />

I would like to be able to do this:

<input data-bind="customBinding0: { customBinding1: observable1, customBinding2: observable2 }" />

thanks in advance.

Answer 1

With Knockout, bindings are specified in name/value pairs, where name is the name of the binding, and value is the value that will be retrieved within the binding using valueAccessor() .

It sounds like you may be wanting to pass multiple values in to a binding, like your kendo example shows. Although each binding can only have a single value, that value can be anything. This means you can pass in an object literal as the value, and the object can have as many properties as you want. These properties can also be of any type that you want - you'll just need to handle them correctly inside your binding.

Here's a simple example:

View

<div data-bind="myBinding: {setting1: viewModelProperty1, 
                            setting2, viewModelProperty2}"></div>

Binding

ko.bindingHandlers.myBinding = {
    init: function(element, valueAccessor) {
        var options = valueAccessor() || {};

        //this gives you the value of setting1
        var setting1 = ko.utils.unwrapObservable(options.setting1);

       //if you need to do something just when `setting1` changes,
       //  add a subscription to the value like so:
       if( ko.isObservable(options.setting1) ){
           options.setting1.subscribe(function(newValue){
              //do something because the setting1 value changed
           });
       }
    }
};

You also have the option of specifying multiple bindings, each with its own value, and referencing the additional bindings and values from within the first one. Knockout's options and optionsText bindings are an example of this approach.

Excellent Resource: http://www.knockmeout.net/2011/07/another-look-at-custom-bindings-for.html

Take some time to study and experiment with the examples at the link above. There's a lot of good information here that covers what you need to do.