josh
josh

Reputation: 1271

How to do nested translation in Angular?

I am trying to do nested translation in angular with a conditional involved as well.

the setup:

<p translate-values="{partnerName: (enterPin.partnerName) ? enterPin.partnerName : {{'YourProvider'}}}" translate>
    {{'EnterPINCodeMessage'}}
</p>

Here is my translation file:

{
    "EnterPINCodeMessage": "Enter the 13 digit PIN code you received from {{partnerName}}. If you do not have a PIN code, please contact {{partnerName}} for assistance.",
    "YourProvider": "your Provider"
}

If enterPin.partnerName has a value I want {{partnerName}} to use that, if not I want {{partnerName}} to use the translation of {{'YourProvider'}}

With this setup, this is my result:

<p translate-values="{partnerName: (enterPin.partnerName) ? enterPin.partnerName : YourProvider}" translate="" class="ng-scope ng-binding">Enter the 13 digit PIN code you received from . If you do not have a PIN code, please contact  for assistance.</p>

which is rendered as

Enter the 13 digit PIN code you received from . If you do not have a PIN code, please contact for assistance.

How can I partnerName to take the translation of 'YourProvider' if enterPin.PartnerName is empty?

Thanks

Upvotes: 0

Views: 1285

Answers (2)

josh
josh

Reputation: 1271

Here is what ended up working:

        <p translate-values="{partnerName: (enterPin.partnerName) ? enterPin.partnerName : '{{'YourProvider' | translate }}' }" translate>{{'EnterPINCodeMessage'}}</p>

Upvotes: 3

MichaelS
MichaelS

Reputation: 3831

I havn't tried it, but I think the braces within the braces are the problem here. So instead of this

<p translate-values="{partnerName: (enterPin.partnerName) ? enterPin.partnerName : {{'YourProvider'}}}" translate>
    {{'EnterPINCodeMessage'}}
</p>

try this

<p translate-values="{partnerName: (enterPin.partnerName) ? enterPin.partnerName : 'YourProvider'}" translate>
    {{'EnterPINCodeMessage'}}
</p>

Upvotes: -1

Related Questions