i have two components in my angular 2 app and i have a md-select in one of them that contain two languages. i want to change the whole project direction after i select one of the languages.

here is part of my component1.html:

```
<md-select class="data_font"  [(ngModel)]="currentLang" #langSelect="ngModel" (ngModelChange)="translate.use(currentLang)">
            <md-option *ngFor="let lang of translate.getLangs()" [value]="lang"><span class="data_font">{{ lang }}</span></md-option>
</md-select>

```

and this is part of component2.html:

```
<div #root="$implicit" dir="rtl" >
   ...//some html code here
</div>

```

and part of component2.ts

```
currentLang = 'fa';
@ViewChild('root') root;
ngAfterViewInit(): void {
    this.root.dir = 'rtl';
  }
RTL(){
    if(this.currentLang == 'fa'){
      this.root.dir = 'rtl';
    }
    if(this.currentLang == 'en'){
      this.root.dir = 'ltr';
    }
  }

```

i can change the direction where root and dir is exist but i want to do it from component 1. how can i do it?is there any way to call RTL() in component1?