app.component.html

<ion-app>
  <ion-split-pane contentId="main">
    <ion-menu contentId="main">
      <ion-header>
        <ion-toolbar>
          <ion-title>
            <span class="ion-hide-sm-down">{{ 'App.NavTitle' | translate }}</span>
            <span class="ion-hide-md-up">{{ 'App.NavTitleShort' | translate }}</span>
          </ion-title>
        </ion-toolbar>
      </ion-header>

      <ion-content>
        <ion-list lines="none">
          <ion-menu-toggle *ngFor="let ruleHead of rulesService.rules" autoHide="false">
            <ion-item color="transparent"
                      (click)="rulesService.navigate$.next(rulesService.indexesToRules[ruleHead.index])"
                      [style.border-left]="'5px solid ' + ruleHead.color" 
                      [style.border-bottom]="'1px solid ' + ruleHead.color">
                      {{ ruleHead.name }}
                      <img *ngIf="ruleHead.icon" class="inline-icon ion-margin-start" [src]="'assets/inicon/faction-' + ruleHead.icon + '.png'" />
            </ion-item>
          </ion-menu-toggle>

          <ion-item class="language">
            <ion-label>Language</ion-label>
            <ion-select placeholder="Select Language" (ionChange)="languageChange()" [(ngModel)]="language">
              <ion-select-option value="en-US">English</ion-select-option>
              <ion-select-option value="pt-BR">Português</ion-select-option>
              <ion-select-option value="es-ES">Español</ion-select-option>
              <ion-select-option value="de-DE">Deutsch</ion-select-option>
              <ion-select-option value="ru-RU">Russian</ion-select-option>
              <ion-select-option value="pl-PL">Polski</ion-select-option>
              <ion-select-option value="nl-NL">Nederlands</ion-select-option>
            </ion-select>
          </ion-item>
        </ion-list>
      </ion-content>
    </ion-menu>

    <ion-router-outlet id="main"></ion-router-outlet>
  </ion-split-pane>
</ion-app>