I'm using an if/else expression and a translation of the possible values inside the placeholder-Tag of an HTML input-element. It obviously doesn't work this way, because of the nested double quotes inside the placeholder-tag:
<input type="number"
placeholder="{{constraint ? '{{"TERM_A" | translate}}' : '{{"TERM_B" | translate}}'}}"
ng-model=""
required
autocapitalize="none"
autocorrect="off" />
How do I set the single/double-quotes accordingly or is there even a more elegant solution?
component. ts file we need to import a translate service from @ngx-translate/core package inject the service in constructor and use it after changing the language. Now create a folder inside assets, name it 'translate,' inside of it create a json file.
After you prepare a component for translation, use the extract-i18n Angular CLI command to extract the marked text in the component into a source language file.
The service also contains a method called translate. It is later called by the pipe to get the translation for a specific key. It always uses the language specified in the 'language'-variable of the service, to lookup the translation. That's it.
Proper way:
<input type="number"
placeholder="{{ (constraint ? 'TERM_A' : 'TERM_B') | translate }}"
ng-model=""
required
autocapitalize="none"
autocorrect="off" />
Another sample:
label="{{ (detailsTriggered ? 'ui.showDetails' : 'ui.hideDetails') | translate}}"
Beware of " [ ] " braces, types of quotation marks and apostrophes.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With