MVVM Documentation accurate?

[Kevin]

I am confused with a few parts of the documentation. Please help me understand what I am missing..

1) http://docs.telerik.com/kendo-ui/api/javascript/view#configuration-model
<div id="app"></div>
<script>
var foo = { foo: "foo" }
var view = new kendo.View('<span data-bind="text:foo"></span>', { model: foo });
view.render($("#app"));
</script>

The documentation says that model takes an observable object. Why isn't foo a kendo observable?
ie: var foo = kendo.observable({ foo: "foo" })


2) http://docs.telerik.com/kendo-ui/framework/spa/view#mvvm-bound-view-with-an-evaluated-template

MVVM Bound view with an evaluated template
<script id="index" type="text/x-kendo-template">
#: foo #
<div>Hello <span data-bind="text:foo"></span>!</div>
</script>

<script>
var model = kendo.observable({foo: "World"});
var index = new kendo.View('index', {model: model});
</script>

Why isn't index constructed with the evalTemplate option set to true?:
var index = new kendo.View('index', {model: model}, evalTemplate: true);

[Petur Subev]

Hello Kevin,

1) If the object that you pass as model is not an observable one, the bind method will internally initialize observable object out of it.

2) I do not understand the question - by default that evalTemplate option is set to false:

http://docs.telerik.com/kendo-ui/api/javascript/view

It would be a breaking change if we modify the default behavior.

Kind Regards,
Petur Subev
Telerik

 

 

[Kevin]

1) If it internally makes it a non-observable an observable can you help me understand what I did wrong in the code snippet below?
I assumed I would need:
var model=kendo.observable({foo: "World"});

http://dojo.telerik.com/eCUd

2) I know that evalTemplate is false by default and that is exactly the point I am making. I apologize for dragging this out, but I need to clarify this to make sure that I am not doing things incorrectly. The title of the section is "MVVM Bound View with an evaluated template" and then a code snippet is provided that APPEARS to NOT show an example of how to bind a view and evaluate a template. I am trying to be polite by assuming I am incorrect which is why I posed this as a question and didn't come say "your documentation is incorrect". The examples in the link you provided are nice and appear to be complete, but I am questioning the SPA section of documentation.

I'm sorry the question wasn't clear, but if you do the following you should be able to understand what I am trying to say:

Step 1) Click the link I provided
Step 2) Read the title and note that it says "MVVM Bound View with an evaluated template"
Step 3) Read the code snippet immediately below the title
Step 4) Initially determine if the code snippet is an example of an MVVM Bound View with an evaluated template
Step 5) Verify that the code snippet is an example of an MVVM Bound View by going to Kendo Dojo which you can find at dojo.telerik.com and paste in the code snippet and click "Run"
Step 6) Realize that the code doesn't actually do anything and that you need to add more code to have a working example
Step 7) Go to the link here that uses the code snippet from step 6, but then renders the view
dojo.telerik.com/OJEj/2
Step 8) Click "run"
Step 9) Determine if the results are what you would expect if you rendered an MVVM Bound View with an evaluated template
Step 10) Go to the link here that uses the code snippet from step 6, but with "evalTemplate: true" and renders the view
dojo.telerik.com/agaZ
Step 11) Determine if the results are what you would expect if you rendered an MVVM Bound View with an evaluated template
Step 12) Reply and let me know if the documentation is incorrect or if I am wrong and the code snippet, as is, is a correct example

[Kevin]

Also, can you help me understand:

Hello Kevin,

1) If the object that you pass as model is not an observable one, the bind method will internally initialize observable object out of it.

http://docs.telerik.com/kendo-ui/framework/mvvm/observableobject

If the View-Model object is going to be used after initialization (before or after calling kendo.bind) the kendo.observable method or new kendo.data.ObservableObject must be used.

If the View-Model object is not going to be used after declaration you can define it as a regular JavaScript object. The kendo.bind method will not convert the original View-Model object to kendo.data.ObservableObject. This is why the following will not work:

var viewModel = {
   name: "John Doe"
};

kendo.bind(document.body, viewModel);

/*
The following statement  will fail because the View-Model
is not an instance of kendo.data.ObservableObject.
*/
viewModel.set("name", "Jane Doe");

[Petyo]

Hello Kevin,

apologies for the misunderstanding and thank you for pointing this out. You are correct, the example in question is incorrect (most likely we copy pasted it from above and overlooked it). I pushed an update, it should be online soon.

Regarding your second question: the behavior described in the documentation is more or less a short-hand "convenience" one. In case you are confused by it, you should always stick to declaring your view models using the kendo.observable factory method:

var viewModel = kendo.observable({ foo: "Foo" });

Please let me know in case you need further help with the topic. 

Regards,
Petyo
Telerik