2
\$\begingroup\$

In his KnockoutJs 1.3 beta post, Steve Sanderson has an example of using Binding providers ("5. Binding providers (and hence external bindings)") where he makes a comment in the JSFiddle JavaScript tab that says "// This syntax would be way more succinct with CoffeeScript".

How would this actually be accomplished?

// This syntax would be way more succinct with CoffeeScript
ko.bindingConventions.conventions(".person-editor", {
    ".person-editor"  : { 'with': myViewModel.person },
    ".first-name"     : function(person) { return { value: person.firstName } },
    ".last-name"      : function(person) { return { value: person.lastName } }
});

ko.bindingConventions.conventions("#weather-list", {
    "#weather-list"    : { 'with': myViewModel.weather },
    ".cities-list"     : function(weather) { return { foreach: weather.cities } },  
    ".city"            : function(item) { return { text: item.city } },      
    ".temp"            : function(item) { return { text: item.temperature } },        
    ".add-city"        : { click: function() { this.addItem() } }  
});
\$\endgroup\$
1
\$\begingroup\$
 ko.bindingConvenrions.conventions ".person-editor"
   ".person-editor"  :  
      'with'   :  myViewModel.person
   ".first-name"     : ( person ) ->
                        value : person.firstName
   ".last-name"      : ( person ) ->
                        value : person.lastName
\$\endgroup\$
1
\$\begingroup\$

This would be even better with simpler spacing and single quotes where interpolation is not being used (a hint to the reader that these strings are literal). Grouping related functions can add clarity, too, if you end up with an unruly number of properties.

ko.bindingConventions.conventions '.person-editor',
  '.person-editor':
    with: myViewModel.person
  '.first-name': (person) ->
    value: person.firstName
  '.last-name': (person) ->
    value: person.lastName

ko.bindingConventions.conventions '#weather-list',
  '#weather-list':
    with: myViewModel.weather
  '.add-city':
    click: ->
      @addItem()
  '.cities-list': (weather) ->
    foreach: weather.cities
  '.city': (item) ->
    text: item.city
  '.temp': (item) ->
    text: item.temperature
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.