CODEWITHSUNDEEP
data-bindingsapui5
user3783327
user3783327

Reputation: 626

How to bind a SAPUI5 control property with data out of a binding?

From time to time I have the requirement to bind a control property to based on data out of model A to another model B.

For example the syntax could look like this (but will not work):

text : "{B>/rootB/{A>someValue}/propertyB}"

I normally solve this problem by "misusing" an unused control property in combination with the format function. It would look like this:

tooltip : {
    path : "A>someValue",
    formatter : function(oValue) {
        // do some checks on oValue
        var path = "B>/rootB/"+oValue+"/propertyB";
        this.bindProperty("text", path);
    return undefined; // because tooltip is not used
    }

The benefit of this, each time "A>someValue" will be changed the binding of "text" will be updated automatically. It is also possible to do this in template code (like items aggregations).

But you may smell the code ;)

Any suggestions to make it cleaner?

Upvotes: 0

Views: 2066

Answers (1)

phigem
phigem

Reputation: 86

As far as I know, there is no such possibility in UI5 (yet). I always use a formatter function as you already mentioned. I say not YET, because developers seem to be aware of this feature request: see on GitHub

BUT, you dont need to missuse a random control property! Just use the formatter to read the needed values from any model you have access to:

text : {
    path : "A>someValue1",
    formatter : function(oValue) {
        // read model B to get someValue2 (based on someValue1)
        var path = "B>/rootB/"+oValue+"/propertyB";
        
        var B = getModel("someModel");
        var someValue2 = B.getProperty(path);
        
        return someValue2
    }

Upvotes: 1

Related Questions