简体   繁体   中英

how to change dir=“ltr” to rtl in html tag or ion-app tag in index.html ionic2?

i'm changing the direction like this

  <ion-nav [dir]="isRtl? 'rtl':'ltr'"></ion-nav>

it works fine except the menu. but my question now is for the <ion-select> because it still in ltr direction because it's not under <ion-nav> , it's under <ion-app> or <body> or <html> tag. so how can i access the variables in app.component to change the direction in index.html depending on language chosen. Or if there any other methods.

What i would do is bind a CSS file to my component (with the decorator), and in it do

* {
    direction: rtl;
}

When you compile it, angular with add a property to all your tags, such as ng_3590F , and in your CSS too. This means, all your tags/IDs/classes in your component will have the right direction.

If I'm not clear, feel free to say it !

EDIT

To use your service in HTML, in your constructor do

constructor(private myService: MyService) {}

And in the HTML of your component you can do

<your-tag [direction]="myService.myProperty"></your-tag>

when change the language (like listener translate.onLangChange) write this

this.platform.setDir('rtl',true);

it change the dir to rtl in html tag
and you can avoid using dir attribute in all ur app except the menu still have issue need to fix it (ionic team working on it).

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM