Binding a compound value

Question

I have a property "color" in my object. I also have 2 more members: "colorCss" and "colorDisplay" that both change depending on "color". Is that possible using WinJS.Binding somehow? Or do I need to resort to knockout for such kind of inter-dependencies of properties in a bound object?

Answer 1

Can you explain the behavior you're hoping to achieve with the binding?

---

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.

Answer 2

foo.color = "red"

should make 

foo.colorDisplay === "Blue"

foo.colorCss === "color:red"

setting foo.color = "blue"

should make 

foo.colorDisplay === "Blue"

foo.colorCss === "color:blue"

Answer 3

I'm really unclear on what this has to do with binding.  But if you provide getters and setters with your object, this is easily done (this is pseudocode):

var foo = {

    color:purple,

    get colorCSS() {

        return "color:" + color;

    }, 

     get colorDisplay() {

        return UpperCaseFunction(color);

    }

  

}

---

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.

Answer 4

That is the easy part. I want the all properties be bindable (to UI). So whenever you change "color", the UI changes too.