Databinding with WinJS as powerful as with knockout?

I have recently started to develop Win8 apps with HTML/CSS/JS. After 2 weeks a question regarding databinding with WinJS arose:

Is it possible to perform databindings via WinJS as powerful as with e.g. knockout.js(Can WinJS do all the things knockout can)?

If so, how would I perform an ko.applyBindings()from knockout with just WinJS?

Answers:

Answer

While "as powerful" is quite subjective, WinJS has a very capable binding engine. It's not the same, but shares some characteristics with Knockout. It's shares some details in some ways to the formerly-known-as Microsoft ASP.NET Ajax Library.

Here's one of their examples:

<div id="boundDiv" data-win-bind="innerText: age"></div>
<script type="text/javascript">
    var person = { age: 0 };
    var span = document.getElementById("boundSpan");
    WinJS.Binding.processAll(span, person);
    var bindingPerson = WinJS.Binding.as(person);

    setInterval(function () {
        changeAge(bindingPerson);
    }, 500);

function changeAge(p) {
    p.age++;
};
</script>

Every 500 millseconds, the div will be updated to reflect the new age of the person. As it's taking advantage of ECMAScript 5's Object property getters and setters, the value of age can be easily tracked and then updated in the div.

Answer

There is a complete example with both the two approaches at the following posts:

http://www.progware.org/Blog/post/Data-binding-in-Windows-8-Apps-with-Knockout.aspx http://www.progware.org/Blog/post/Data-binding-in-Windows-81-Apps-with-WinJS.aspx

Both methods are applied to the same ViewModel and everything is suppoorted (two way binding, converters etc).

Answer

One thing that's unfortuantely missing in WinJS is two-way databinding. So you have to write some code to get user input in the ui back into your view model.

So you could either implement change handlers for your controls like in the SDK Sample or use the more generic solution form the expression blend blog

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.