Empty controls

[daresh]

Hi!

I have an issue with the localize plugin. I have a simple app with two pages.

XML of page 1:
<Page> <StackLayout> <Label text="{{L('welcome')}}" textWrap="true"/> <Button text="{{ L('start.test') }}" tap="onTapStart" /> </StackLayout> </Page>

XML of page 2:
<Page loaded="onLoaded"> <StackLayout> <Image src="~/images/Normalized_Rorschach_blot_01.jpg" stretch="aspectFit" /> <GridLayout rows="auto, auto, auto, auto" columns="2*, *" class="answers"> <Label tap="selectAnswer1" text="{{ L('q1.ans1') }}" textWrap="true" row="0" col="0" /> <Switch checked="{{ answer1 }}" row="0" col="1" /> <Label tap="selectAnswer2" text="Answer2" textWrap="true" row="1" col="0" /> <Switch checked="{{ answer2 }}" row="1" col="1" /> <Label tap="selectAnswer3" text="Answer3" textWrap="true" row="2" col="0" /> <Switch checked="{{ answer3 }}" row="2" col="1" /> <Label tap="selectAnswer4" text="{{ L('Lorem ipsum dolor sit amet.') }}" textWrap="true" row="3" col="0" /> <Switch checked="{{ answer4 }}" row="3" col="1" /> </GridLayout> <Button text="{{ L('Next question')}}" tap="" /> </StackLayout> </Page>

After running the app (even after tns platform clean android and then run) I have empty controls on the first page, here's what I see in the chrome debug:
<Page> <StackLayout> <Label></Label> <Button></Button> </StackLayout> </Page>

The other page works fine, all the texts are in place and translated.

The lang file en.default.js:
module.exports = { "app.name": "Rorschach Test", "welcome" : "Welcome!!", "start.test" : "Start the test", "q1.ans1" : "answer1" }

NativeScript Core, Windows 10, target platform android, everything is a fresh install (latest versions).

[daresh]

Weird, but it started working after I added some empty observable and bound it:
const observableModule = require("data/observable"); const context = new observableModule.fromObject({}); exports.onLoaded = function (args) { page = args.object; page.bindingContext = context; };

Don't know if it's a bug or a feature, you may take a look at it :)

[lfabreges]

Not a bug nor a feature, it seems that you have to add a bindingContext to access application resources, if you take a look at the demo, I just do page.bindingContext = {};

[daresh]

Thanks! So it's just a thing to remember :)

Is it possible to localize also code in JS, like for example alert messages using your plugin?

[lfabreges]

Yes you can, just use the localize function directly:

const localize = require("nativescript-localize").localize;