locked
Questions on converter functions for data-win-bind property RRS feed

  • Question

  • Question 1: how to pass more than one parameter into the converter function? In my project the displayed value depends on two data properties

    Question 2: in the converter function, how to access the binding HTML element? In my project it is a DIV and I need to fill its content by async calling a underlying data source. I want it to be a async function because accessing the data source takes seconds of time.

    Thanks!

    Sunday, September 9, 2012 7:58 AM

Answers

  • Hi

    1 For WinJS.Binding.converter function, you can use a function, and pass more parameter in that function.

    2 If this binding element not in a template: 

    var targetElement=document.getElementById("DIVID");

    If this element binding in a template you need dynamic create the element:

    http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/556c4234-0c98-473b-b526-ab6d6f11dabf

    If I mis-understand your question, please comment.

    Thanks.

    • Marked as answer by Vista Xia Monday, September 17, 2012 5:05 AM
    Tuesday, September 11, 2012 5:05 AM
  • For your first question:

    You can only pass in one argument. To pass in more parameters you have to create an object with the parameters you wish to pass in, and then pass that object to the binding converter.

    Here is an example:

    data.myObject = { field1: "value", field2: 123 }; // Where 'data' is your existing data object.

    <p data-win-bind="textContent: myObject Data.myConverter"></p>

    Then you can access them like this:

    WinJS.Namespace.define("Data", {
            myConverter: WinJS.Binding.converter(function(myObject) {
                // TODO: Add your stuff here.
                var field1 = myObject.field1; // This is "value".
                var field2 = myObject.field2; // This is 123.
                return "Return something";
            })
        });

    • Proposed as answer by Aratys Saturday, September 15, 2012 3:47 PM
    • Marked as answer by Vista Xia Monday, September 17, 2012 5:05 AM
    Saturday, September 15, 2012 3:45 PM

All replies

  • Hi

    1 For WinJS.Binding.converter function, you can use a function, and pass more parameter in that function.

    2 If this binding element not in a template: 

    var targetElement=document.getElementById("DIVID");

    If this element binding in a template you need dynamic create the element:

    http://social.msdn.microsoft.com/Forums/en-US/winappswithhtml5/thread/556c4234-0c98-473b-b526-ab6d6f11dabf

    If I mis-understand your question, please comment.

    Thanks.

    • Marked as answer by Vista Xia Monday, September 17, 2012 5:05 AM
    Tuesday, September 11, 2012 5:05 AM
  • Hi, is this syntax correct?

    <p data-win-bind="textContent: field1 field2 Data.MyConverter"></p>

    where Data.MyConverter accepts two arguments. it looks it cannot compile.

    The 2nd question is solved, thanks!


    • Edited by Vista Xia Friday, September 14, 2012 5:03 AM
    Friday, September 14, 2012 5:02 AM
  • For your first question:

    You can only pass in one argument. To pass in more parameters you have to create an object with the parameters you wish to pass in, and then pass that object to the binding converter.

    Here is an example:

    data.myObject = { field1: "value", field2: 123 }; // Where 'data' is your existing data object.

    <p data-win-bind="textContent: myObject Data.myConverter"></p>

    Then you can access them like this:

    WinJS.Namespace.define("Data", {
            myConverter: WinJS.Binding.converter(function(myObject) {
                // TODO: Add your stuff here.
                var field1 = myObject.field1; // This is "value".
                var field2 = myObject.field2; // This is 123.
                return "Return something";
            })
        });

    • Proposed as answer by Aratys Saturday, September 15, 2012 3:47 PM
    • Marked as answer by Vista Xia Monday, September 17, 2012 5:05 AM
    Saturday, September 15, 2012 3:45 PM