본문 바로가기

Programming/Angular

ionic 하이브리드 앱 개발 - #6 ionic native

반응형

Ionic Native는 Cordova 플러그인  TypeScript 개발도구로써 Ionic 모바일 어플리케이션에 필요한 기본 기능을 손쉽게 추가 할 수 있습니다.

 

Promises 와 Observables

Ionic Native는 Promise 또는 Observable에서 플러그인 콜백을 통하여 모든 플러그인에 공통 인터페이스를 제공하고 네이티브 이벤트가 Angular로 변경 감지하도록 보장합니다.

import { Geolocation } from '@ionic-native/geolocation';
import { Platform } from 'ionic-angular';

class MyComponentOrService {

constructor(private platform: Platform, private geolocation: Geolocation) {

platform.ready().then(() => {

// get current position
geolocation.getCurrentPosition().then(pos => {
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
});

const watch = geolocation.watchPosition().subscribe(pos => {
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
});

// to stop watching
watch.unsubscribe();

});

}

}

 

 

설치

Ionic Native를 앱에 추가하려면 다음 명령을 실행하여 관련 패키지를 설치하십시오.

npm install @ionic-native/core --save

 

사용법

필요한 플러그인 설치하려면 각 플러그인별 Ionic Native 패키지를 설치하십시오.

예를 들어, Camera Plugin을 설치하려면 다음 명령을 실행해야합니다.

npm install @ionic-native/camera --save

 

그런 다음 Ionic CLI를 사용하여 플러그인을 설치하십시오.

ionic cordova plugin add cordova-plugin-camera

 

 

 

앱 모듈에 플러그인 추가


플러그인 패키지를 설치 한 후 앱의 NgModule에 패키지를 추가하여야 합니다.

...

import { Camera } from '@ionic-native/camera';

...

@NgModule({
...

providers: [
...
Camera
...
]
...
})
export class AppModule { }