Ionic 4 - How change dir for multi language app

#1

Hi
how can change dir of app in multi language app. change rtl and tlr
in ionic 3 it’s possible by multi language app Platform setDir but i don’t know in ionic v4

Thanks

#2

I found a way to do this!

First, I added code to my constructor to inject the DOCUMENT.

constructor(
    public http: HttpClient,
    public platform: Platform,
    public storage: Storage,
    // Next line thanks to:
    // https://angularfirebase.com/lessons/css-variables-in-ionic-4/
    // This is used to set some CSS styles for *all* elements in the DOM.
    @Inject(DOCUMENT) private document: Document,
  ) {

then, when the user selects a right-to-left language, I set the dir property on all elements (or maybe it is just the top html element):

  setDirectionTo(dir: Direction) {
    this.document.documentElement.dir = dir;
  }

(My Direction type is just a type with two possible values; ‘ltr’ and ‘rtl’.)

And, voila! pages and menus, etc., are all reversed.

1 Like