0

It's a pretty simple question, so I'm really hoping for a simple solution. I don't want to use any of the external templating libraries, because whilst I am familiar with EmberJS, Ember would be overkill for the application I'm currently working on.

I've set-up a quick JSFiddle: http://jsfiddle.net/zeEFP/3/

Wildhoney
  • 4,969
  • 33
  • 38

2 Answers2

1

ko.applyBindings() takes the viewmodel as a parameter. I've updated your fiddle:

http://jsfiddle.net/zeEFP/4/

It was failing before because you were telling knockout to look for properties within the ViewModel property of the ViewModel object

daedalus28
  • 1,637
  • 1
  • 12
  • 24
  • Thanks. But you've removed my "with" context, which is really what the question is about. I want to tell this code within the HTML comments in my original Fiddle () to bind to the ViewModel, so that the "name" parameter isn't global. – Wildhoney Jun 18 '12 at 13:04
  • The name parameter isn't global - ko.applyBindings is scoped to the context of the view model you pass into it – daedalus28 Jun 18 '12 at 13:06
  • If that is so, how can I then specify different values where there's a duplicate name? For example on the updated JSFiddle: http://jsfiddle.net/zeEFP/5/ both "name" variables are global, because they don't point to a specific View Model. As you see in that example, both "name" variables in the view get taken from the second view model, because that's what is loaded last. It would be silly to have to name the one in my second view model something like "secondViewModelName". There must be a way to specify which view model the data should come from, no? – Wildhoney Jun 18 '12 at 14:04
  • There are two ways to do this. You could either create a composite view model, or only bind to a partial view. – daedalus28 Jun 18 '12 at 14:18
  • Thank you also! You've helped me a lot. – Wildhoney Jun 18 '12 at 16:57
  • Glad to help - if your question is answered you should mark an accepted answer. I'd be inclined to say that you should choose mine since it was first and contained plenty of examples in the comments, but I am obviously biased. Either way, just make sure you pick one of them by clicking the check mark next to the answer – daedalus28 Jun 18 '12 at 17:17
1

In your initial fiddle you are applying the view model to the entire dom (or more specifically window.document.body) because you are not supplying a context element. Therefore you do not need the with binding (the with binding creates a new binding context whereas you're already in the correct binding context)

See: http://jsfiddle.net/zeEFP/10/

If you wish for multiple view models then you can supply a context to the applyBindings method:

ko.applyBindings(new FirstViewModel(), document.getElementById("someId));

See the updated fiddle here: http://jsfiddle.net/zeEFP/8/

If you do not like having additional markup to supply as a context for the applyBindings you can instead use an over-arching view model and then use the with binding to create new contexts for parts of the page

See: http://jsfiddle.net/zeEFP/11/

Hope that helps clear things up for you

WickyNilliams
  • 5,218
  • 2
  • 31
  • 43
  • Perfect! Explained beautifully. Thank you. – Wildhoney Jun 18 '12 at 16:57
  • No problems! Please consider marking one of the answers as accepted if they have helped. Having a good track record for accepting answers increases your chances of more answers in future questions (or conversely people are less likely to answer questions for someone who never accepts answers) – WickyNilliams Jun 18 '12 at 17:52