How to pass bindingContext to top-level TabView

0
votes

I need to localize TabViewItem title when TabView used as main navigation with Frame items (app generated with Nativescript Sidekick -> General -> TypeScript -> Tab Navigation).

For localization I use nativescript-localize plugin, with next initialization in app.ts for use in template:

import * as app from "tns-core-modules/application";
import { localize } from "nativescript-localize";

app.getResources().L = localize;

app.run({ moduleName: "app-root" });

And app-root.xml has next content:

<TabView androidTabsPosition="bottom">
    <TabViewItem title="{{ L('catalog') }}">
        <Frame defaultPage="pages/catalog/catalog-page"></Frame>
    </TabViewItem>

    <TabViewItem title="{{ L('notifications') }}">
        <Frame defaultPage="pages/notifications/notifications-page"></Frame>
    </TabViewItem>
</TabView>

If I use next construction {{ L('catalog') }} in final pages with initialized bindingContext then everything works as expected. But in top-level TabView this construction does not work. I think it is because not initialized bindingContext, but how can I initialize it for top-level TabView.

For testing and prototyping, I create Playground - top level TabView. In this Playground instead nativescript-localize plugin I use the function which return text, and as you can see it successfully executed in home-page.xml, but does not executed in app-root.xml.

1
nativescript

1 Answers

1
votes

I suspect it's an edge case bug, it seems the expressions are not processed until a bindingContext is set.

Just declaring bindingContext attribute in XML seems to solve the issue

<TabView androidTabsPosition="bottom" bindingContext="">

Updated Playground