knockout.js - When required Knockoutjs custom binding -

trying learn knockoutjs.i have found knockoutjs custom binding related code not good.

<input data-bind="value: name" /> <hr/> <div data-bind="fadeintext: name"></div>  ko.bindinghandlers.fadeintext = {     update: function(element, valueaccessor) {         $(element).hide();         ko.bindinghandlers.text.update(element, valueaccessor);         $(element).fadein();      }  };  var viewmodel = {     name: ko.observable("bob") };  ko.applybindings(viewmodel); 

i not understand when people go custom binding ?

1) if possible tell me few situation when custom binding option?

2) if see code can understand custom binding fadeintext , viewmodel has no relation still working. how ?

3) if there multiple view model how specify viewmodel name binding name @ time of binding ?

jsfiddle link of above code http://jsfiddle.net/rniemeyer/smkpz/

4) how achieve same output without custom binding ? possible ?

please answer question point wise. thanks

here few answers:

1. custom bindings useful in many scenarios and, in opinion, shouldn't used last resort. anytime want connect dom , data in way not supported built-in bindings, option. listed above, here article clarify.

2. the custom binding has relationship view model indirectly calling ko.bindinghandlers.text.update. so, wrapping actual text binding. text binding reads passed in value , displays.

3. for multiple view models, answer describes options handling multiple view models.

4. without custom binding, choose not use jquery , use css (with consideration browser support , prefixes). example, add class element like:

with css like:

.message {     opacity: 0;     transition: opacity 2s ease-in; }  .load {     opacity: 1; } 

the element start opacity: 0 , transition opacity: 1 on 2 seconds.

i not recommend using jquery directly in view model. custom bindings tool available these scenarios , provide of power knockout provides.

hope helps.