#ngx-translate

32 messages · Page 1 of 1 (latest)

teal scarab
#

It probably means that the other comonents are part of another module, where you haven't imported TranslateModule.

thorn wagon
teal scarab
#

If you don't post your code, we can't help. Please read #how-to-get-help , and post a complete minimal reproduction.

thorn wagon
#

Do i need to add a module.ts to each component? Or could I just use one for all components?

thorn wagon
teal scarab
#

If you follow the guide in the README, it should work fine. Post a stackblitz that reproduces what you've done.

thorn wagon
#

absence-overview.component.html:

<div class="w3-card-4" style="width: 100%; padding-bottom: 0.3125rem; height: auto">
  <header class="w3-container w3-dark-grey">
    <div style="display: flex; justify-content: space-between; padding-top: 0.3125rem; padding-bottom: 0.0125rem">
      <button (click)="useLanguage('en')">en</button>
      <button (click)="useLanguage('de')">de</button>
      <h2>{{ 'demo.title' | translate }}</h2> <!--UNDERLINED ERROR AT translate-->
      <td style="justify-content: center">```
thorn wagon
#

So can you help me?

teal scarab
#

Your AbsenceOverviewComponent is not in the declarations of AppModule. So it's not part of that module. So it doesn't have access to the translate pipe. Which module is it declared in?

thorn wagon
#

ah so I need to declare it in the app module

#

not the whole ngx in another app module

teal scarab
#

Unless a component is standalone, it must be declared in exactly one NgModule of the app. If your app has only one NgModule, then that's the one it must be declared in.

thorn wagon
#

AbsenceManagementModule is highlighted

teal scarab
#

As I said: a component must be declared in exactly one module. You're trying to declare it in two separate modules. That's not allowed. If it's declared in AbsenceManagementModule, then that module must also import TranslateModule, otherwise its components won't have access to the translate pipes/directives.

thorn wagon
#

It is not declared in absence-management.module.ts and currently neither importer. Should I import it or that also not?

#

It's executing now, thanks

#

How can I make it, that both translates at the same time, without having to press each button?

teal scarab
#

I don't understand what you're asking.

thorn wagon
#

Currently I have for each component a button EN/DE

#

and it works. But I'd like one button to translate the whole page.

teal scarab
#

The button should change the language used by ngx-translate then.

thorn wagon
#

correct. But it should do it for the whole app

teal scarab
#

That should do it. Post a complete minimal reproduction of your issue, as a stackblitz. My guess is that you've called TranslateModule.forRoot() twice. Don't do that. forRoot(), as its name implies, is only supposed to be called in the root module.

thorn wagon
#

You fixed it thank you.

#

I can't really post the entire app. It's huge.

teal scarab
#

a minimal repro is never the entire app. It's just a minimal reproduction of what happens in your app. So in this case, it would consist in two modules, with two stupid components, which would reproduce the same issue as the one you have in your app.

thorn wagon
#

Oh I see. Thank you anyways 🙂

#

You've been very helpful and I've learned something new

teal scarab