CODEWITHSUNDEEP
angularngx-translate
john.acb
john.acb

Reputation: 213

ngx-translate: how to 'translate' a html attribute?

I've implemented ngx-translate in my Angular-Cli app and works fine when I do something like:

<div>{{ 'some.value' | translate }}</div>

But how can I go about translating an attribute of an HTML component? Something like:

<div data-text="{{ 'some.value' | translate }}"></div>

(this code above doesn't work)

Thanks in advance for any help provided...

JB

Upvotes: 5

Views: 5977

Answers (2)

Strider
Strider

Reputation: 3749

This should work

<div [attr.my-attribute]="'value.to.translate' | translate"></div>

Upvotes: 5

MCattle
MCattle

Reputation: 3167

What error are you getting?

The code, as it appears, should work, but there's also another option to try:

<div [data-text]="'some.value' | translate"></div>

Off the top of my head, I'd guess you're getting an error like 'data-text' is not a property of <div>, in which case it's not an ngx-translate issue but a missing imports in your .component.ts file that could add the missing attribute.

Upvotes: 12

Related Questions