locked
Expose whole WinJS.UI.Page instance as model for binding

    Question

  • I see the WinJS.UI.Page we can define as a kind of controller for the HTML page it is defined for.

    Therefore I would like to have the whole page act as a model for the view. I would like to expose all its properties and methods to the HTML page's databinding.

    However just calling WinJS.Binding.processAll(element, this) does not work. The page itself is not observable, so changes to its properties are not visible in the bound HTML elements.

    Any ideas?

    Thursday, April 3, 2014 2:10 PM

All replies

  • I'm not really sure why it isn't working, but perhaps you can set an element just under the root of the body and bind to that?

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Friday, April 4, 2014 12:24 PM
    Moderator
  • Well I'd like to use something like that:

    MyPage = WinJS.UI.Pages.define("test.html", { init: function() { this.items = new WinJS.Binding.List() },

    processed: function(element) {
    WinJS.Binding.processAll(element, this);

    } later: function() { this.items.push(...); // This should update the UI this.items = new WinJS.Binding.List() // and this as well } }); WinJS.Class.mix(MyPage, WinJS.Binding.mixin)

    Somehow this does not work as easy as I would have thought. Once the items binding list is bound and I add items to it, the UI updates. But when I exchange the list with another one, the UI does not reflect that change.

    <div data-win-control="WinJS.UI.ListView" data-win-bind="winControl.itemDataSource:items.dataSource></div>

    Tuesday, April 8, 2014 11:41 PM