Value of one Model is key to another - how to do this?

[deandavis]

I have a sap.m.List that I create the list items from a JSON model (named model as "mainMenu"), the model is attached to my JSON view

{

    "mainMenu": [{

        "title": "Literature",

    }, {

        "title": "Video",

    }, {

        "title": "Presentations",

    }]

}

To create the list, in my JSON view I use a list template...

var oListTemplate = new sap.m.StandardListItem({

            title: "{title}",

            type: sap.m.ListType.Navigation,

        });

My issue is that I have a i18n resource model set on this view as well.

mainMenu_Literature=Literature

mainMenu_Video=Video

mainMenu_Presentations=Presentations

In my template I can't use...

title: "{i18n>?}"

because I have nothing to put into the ? spot.

What I'd like to do is change my JSON model to...

{

    "mainMenu": [{

        "title": "mainMenu_Literature",

    }, {

        "title": "mainMenu_Video",

    }, {

        "title": "mainMenu_Presentations",

    }]

}

Then in the template use...

var oListTemplate = new sap.m.StandardListItem({

            title: "{i18n>{mainMenu>/title}}",

            type: sap.m.ListType.Navigation,

        });

But, of course, that binding syntax is a fantasy.

My my problem is clear, I want to use the value of one model as the key to the second.

Suggestions?

Thanks.

[Qualiture · Accepted solution]

Hi Dean,

I tend to use a formatter function which returns the internationalized value for the model-bound property.

See my answer on a similar question on Stackoverflow: How is localized data binding set up with JSON files and XML views?

[deandavis · Accepted solution]

Looks like formatter functions only work in XML and HTML views?

OpenUI5 SDK - Demo Kit

I'm using a JS view like this.

This is in my sap.ui.jsview("SP.view.mainMenu") view declaration

var oListTemplate = new sap.m.StandardListItem({

            title: "{path: 'title', formatter: '.getI18nValue'}",

            type: sap.m.ListType.Navigation

        });

And this is on my sap.ui.controller("SP.view.mainMenu") declaration

getI18nValue: function (sKey) {

        return this.getView().getModel("i18n").getProperty(sKey);

    }

and I get a console error "formatter function .getI18nValue not found!"

So either formatter functions don't work in JS views or I'm not declaring my formatter function correctly or in the right file.

I think I'm probably still doing something wrong.

[former_member104848 · Accepted solution]

Hello Dean,

I am wondering why you have the "." before the function name in the formatter?

var oListTemplate = new sap.m.StandardListItem({

            title: "{path: 'title', formatter: '.getI18nValue'}",

            type: sap.m.ListType.Navigation

        });

The issue seems to be because your function is not getting resolved.

You could look at having a separate Formatter class , for eg :  'SP.view.mainMenu.Formatter' , have all the formatter functions in this class. You could then load this file using jQuery.sap.require('SP.view.mainMenu.Formatter') and then add the formatter function in your binding as follows:

var oListTemplate = new sap.m.StandardListItem({

            title: "{path: 'title', formatter: 'SP.view.mainMenu.Formatter.getI18nValue'}",

            type: sap.m.ListType.Navigation

        });

Regards,

Radhika

[deandavis · Accepted solution]

For a declarative view (XML, HTML) the "dot" in front of the function name is to let the view know that the formatter function can be found in the controller.

I solved this by using a factory function instead of a template to create the list items.

By using the function I was able to get the key from mainMenu model then query the i18n model using that key.

I will try your idea when I have some time to re-visit this in my application.

Thanks.

[former_member182372 · Accepted solution]

oListTemplate = new sap.m.StandardListItem({

            title: {path: 'title', formatter: controller.getI18nValue},

            type: sap.m.ListType.Navigation

        });

[deandavis · Accepted solution]

Tried this but it didn't work for me. I didn't put any real debugging time into it so it may have just been my programming.

[deandavis · Accepted solution]

Tried this also but it also didn't work for me. Like the previous possible solution I didn't put any real debugging time into it. Again, may have been my own programming issue.

Now that I have it working with a factory function I'm moving on.

Thanks for all the suggestions.

[agentry_src · Accepted solution]

Please mark this Discussion with a Correct Answer and Helpful Answer where appropriate.  See http://scn.sap.com/community/support/blog/2013/04/03/how-to-close-a-discussion-and-why   Even if you discovered the solution without any outside contributions, it helps others to understand what the solution turned out to be.

Regards, Mike (Moderator)
SAP P&I Technology RIG