ember.jsember-cliember-i18n

Ember: How to use ember i18n translation in view


In our project we have built some components that are actually default views, is it possible to translate view properties, for example we pass title for each page.

E.g

This is my view that has a dynamic title to be shown for each page {{view.titleToShow}}

..templates/view/simple-navbar.hbs

<div class="navbar-header pull-left">
      <div class="navbar-brand">
          {{view.titleToShow}} 
      </div>
</div>

..templates/cars/cars.hbs

{{view 'simple-navbar'
  titleToShow='Projects'
  ...
}}

..translations/eng.js

import Ember from 'ember';

export default Ember.Object.create({
  eng: {
    General: {      
        SequenceAnalyze:            "Sequence Analysis",
        UNITESH:                    "Unite Species Hypotheses",

    },
    Specimen : {

    },
})

And an example of regular usage in template {{i18n-t 'General.Save'}}

<button {{action 'createStudy'}} class="btn btn-default"><span class="glyphicon glyphicon-ok"></span> {{i18n-t 'General.Save'}}</button>

Solution

  • Should be

    titleToShow: Ember.I18n.t('General.Save')