diff --git a/demos/i18n/index.ts b/demos/i18n/index.ts
index 997da2be39..bdf66c9b61 100644
--- a/demos/i18n/index.ts
+++ b/demos/i18n/index.ts
@@ -3,10 +3,11 @@ import {Control, ControlGroup} from 'angular2/forms';
import {IonicApp, App, Http} from 'ionic/ionic';
-import {Translate} from 'ionic/ionic';
+import {Translate, TranslatePipe} from 'ionic/ionic';
@App({
- templateUrl: 'main.html'
+ templateUrl: 'main.html',
+ pipes: [TranslatePipe]
})
class MyApp {
constructor(app: IonicApp, trans: Translate) {
@@ -18,8 +19,8 @@ class MyApp {
});
console.log(this.trans.translate('Location'));
- console.log(this.trans.translate('de', 'Location'));
- this.trans.setLanguage('de');
+ console.log(this.trans.translate('Location', 'de'));
+ //this.trans.setLanguage('de');
console.log(this.trans.translate('Location'));
}
diff --git a/demos/i18n/main.html b/demos/i18n/main.html
index 1882213767..d73601f91c 100644
--- a/demos/i18n/main.html
+++ b/demos/i18n/main.html
@@ -1,12 +1,5 @@
-
- Plugins
+
-
-
-
+ Hello! What is your {{ 'Location' | translate }}
-
-
-
+
diff --git a/ionic/ionic.ts b/ionic/ionic.ts
index 359ed77413..c7fa97ad3f 100644
--- a/ionic/ionic.ts
+++ b/ionic/ionic.ts
@@ -26,3 +26,4 @@ export * from './transitions/md-transition'
export * from './platform/plugins'
export * from './translation/translate'
+export * from './translation/translate_pipe'
diff --git a/ionic/translation/translate.ts b/ionic/translation/translate.ts
index 61659a6f47..835433e57d 100644
--- a/ionic/translation/translate.ts
+++ b/ionic/translation/translate.ts
@@ -18,22 +18,18 @@ export class Translate {
return this._transMap[lang];
}
- translate(lang, key) {
- // If called with just one param, first is the key
- if(typeof key === 'undefined') {
- key = lang;
- lang = this._language;
- }
-
- // If the language isn't specified, return the string passed.
- if(!lang) {
+ translate(key, lang) {
+ // If the language isn't specified and we have no overridden one, return the string passed.
+ if(!lang && !this._language) {
return key;
}
- let map = this.getTranslations(lang);
+ let setLanguage = lang || this._language;
+
+ let map = this.getTranslations(setLanguage);
if(!map) {
- console.warn('I18N: No translation for key', key, 'using language', this._language);
+ console.warn('I18N: No translation for key', key, 'using language', setLanguage);
return '';
}
return this._getTranslation(map, key);
diff --git a/ionic/translation/translate_pipe.ts b/ionic/translation/translate_pipe.ts
new file mode 100644
index 0000000000..34181b6240
--- /dev/null
+++ b/ionic/translation/translate_pipe.ts
@@ -0,0 +1,30 @@
+import {Injectable, Pipe, PipeTransform} from 'angular2/angular2';
+
+import {Translate} from './translate';
+
+/**
+ * The Translate pipe makes it easy to translate strings.
+ *
+ * @usage
+ * Translate using the current language or language set through Translate.setLanguage
+ * {{ 'Please enter your location' | translate }}
+ *
+ * Translate using a specific language
+ * {{ 'Please enter your location' | translate:"de" }}
+ */
+@Pipe({name: 'translate'})
+@Injectable()
+export class TranslatePipe implements PipeTransform {
+ constructor(translate: Translate) {
+ this.translate = translate;
+ }
+ transform(value, args) {
+ let lang;
+ if(args.length > 0) {
+ lang = args[0];
+ }
+ return this.translate.translate(value, lang);
+ }
+
+ supports(obj) { return true; }
+}