Ionic html 플랫폼 구분하여 코딩하기 (IOS, Android html 따로 코딩)

안녕하세요. IT김군입니다.

오늘은 html 화면에 Android , IOS 구분하여 보여지게 하는 법에 대해 알아보겠습니다.

아래와 같이 기능을 사용하실 페이지의 ts파일에서 Platform을 import 해주셔야합니다.

import { Platform } from 'ionic-angular';

constructor(platform : Platform){
    this.platform = platform;
}

위 코드를 완료하였다면 이제 분리해서 코딩할 html 파일에 들어갑니다.

아래는 버튼으로 만든 예제입니다.

<button *ngIf="platform.is('android')" ion-button>Android</button>
<button *ngIf="platform.is('ios')" ion-button>IOS</button>

위와 같이 써주면 Android 디바이스에서는 Android 라는 이름의 버튼만 보이고

IOS 디바이스에서는 IOS 라는 이름의 버튼만 보입니다.

궁금하신 점 댓글주세요. 감사합니다.