Is it possible to translate strings inside the source code of a component in Angular6.
F. e.
window.confirm("HELP me");
I haven't found anything besides the normal translation for the HTML files (Angular Docs i18n).
Thank you in advance
Add a comment
|
3 Answers
You can use https://github.com/ngx-translate/i18n-polyfill until Angular i18n get built-in support for it, probably around version 9. The author is working on Angular i18n, so I think it is safe to trust his expectation that it will be close to the future feature in Angular i18n.
There is a lot of interesting information about the future of Angular i18n in this issue: https://github.com/angular/angular/issues/16477
Comments
i've tried a solution for that and it works, this how i managed it to translate my ngx-toaster alerts that are called inside my ts file, for example i have this:
ngOnInit() {
this.toastrService.success('created successfully', '');
}
i converted it to this
@ViewChild('test') myDivElementRef: ElementRef;
...
constructor(private toastrService: ToastrService) {}
ngOnInit() {
this.toastrService.success(this.myDivElementRef.nativeElement.outerHTML, '', {
enableHtml : true
});
and in my template, i create a div with #test reference
<h2 i18n="@@testTitle" #test [hidden]="true">created successfully</h2>
Comments
In Material Angular 6:
import { locale as english } from './i19n/en';
import { locale as français } from './i19n/fr';
import { ToastrManager } from 'ng6-toastr-notifications';
Declaration
@ViewChild('espiontest') myDivElementRef: ElementRef;
in constructor
constructor(
public toastr: ToastrManager){
}
in your function or OnInt
this.toastr.successToastr(this.myDivElementRef.nativeElement.outerHTML, null, {enableHTML: true});
In html, this element {{'Add_Profil_application_lang.Creationeffectuée' | translate}} is translation in files ./i19n/en and ./i19n/fr
<pre>
<p [hidden]="true">
<span #espiontest>{{'Add_Profil_application_lang.Creationeffectuée' | translate}}
</span>
</p>
</pre>
