panter / vue-i18next

Internationalization for vue using the i18next i18n ecosystem.
https://panter.github.io/vue-i18next/
176 stars 47 forks source link

Namespace question #50

Closed rcosta-gcare closed 5 years ago

rcosta-gcare commented 5 years ago

Is there a way to pass namespace with the translation?? For example: $t('my-name-space:key')

If not, is there a way to load name space based on a variable?

claudiocro commented 5 years ago

Hi,

your example should work out of the box. What are you getting when you use it like this?

claudiocro commented 5 years ago

I will close this issue, feel free to reopen it if you have more questions.

rcosta-gcare commented 5 years ago

I figure out the trick... my problem was that this $t('my-name-space:key') doesn't load the name space, and actually that is what I meant, I was trying to find a way to load a name space with a variable, which I didn't find a way of doing yet.

claudiocro commented 5 years ago

To load namespaces you can:

Vue.component("app", {
  i18nOptions: { namespaces: "common" },
  template: ....

This will load the namespace into the component, so you don't need to use $t('common:somekey') but $t('common:somekey').

Then you need to instruct vue-i18next to load the namespace:

vueI18Next = new VueI18Next(i18next, { 
  loadComponentNamespace: true
 });

I noticed that the loadComponentNamespace option is not documented, I will change that.

rcosta-gcare commented 5 years ago

Oh very nice, didn't know about loadComponentNamespace that might works for me.

That is what I was trying to do

Vue.component("app", {
  props: {
    validation
  },
  i18nOptions: { namespaces: validation },
  template: ....

What I end up doing, is on my parent component, I load the name space, so on the children, I can use $t('validation:somekey')