How to add Direction ['ltr', 'rtl'] in ionic 4 dynamically?

Viewed 763

I have an ionic application which supports multiple languages. How can I do Change Direction dynamically?

Thanks for the help.

3 Answers

I think we can do it by,

document.documentElement.dir = 'rtl';

Maby that helpfull

<ion-tabs mode="ios" dir="{{currentLanguage == 'en'?'ltr':'rtl'}}">

or

<ion-tabs mode="ios" [dir]="currentLanguage == 'en'?'ltr':'rtl'">

Can you try below:

import { Component, Inject } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { DOCUMENT } from '@angular/common';

constructor(
    @Inject(DOCUMENT) private document: Document,
    private translate: TranslateService) {
    this.lang = localStorage.getItem('LANG');
  }

  languageChanged() {
    localStorage.setItem('LANG', this.lang);
    this.translate.setDefaultLang(this.lang);
    if (this.lang === 'iw')
      this.document.documentElement.dir = 'rtl';
    else
      this.document.documentElement.dir = 'ltr';
  }
Related