@coreo/ionic-photo

@coreo/ionic-photo

Ionic 2+ module for taking pictures to submit to Coreo.

Installation

ionic cordova plugin add cordova-plugin-camera cordova-plugin-file cordova-plugin-filepath --save
yarn add @coreo/ionic-photo

Usage

Import the module in your app.module.ts:

import { CoreoPhotoModule } from '@coreo/ionic-photo';
...
@NgModule({
    imports: [
        ...
        CoreoPhotoModule
        ...
    ]
})
export class AppModule {}

CoreoPhoto service

Inject the service into your component:

import { CoreoPhoto } from '@coreo/ionic-photo';

@Component()
export class MyComponent() {
    constructor(private photo: CoreoPhoto) {}
}

Methods

• capturePicture(opts) - capture a picture using the camera. Returns promise which is resolved with the filename of the picture that was captured. Use resolvePicturePath() or the coreoPhoto pipe to convert this into an absolute path for displaying or submitting the photo.
• selectPicture(opts) - selects a picture from the device's photo library. Returns promise which is resolved with the filename of the picture that was captured. Use resolvePicturePath() or the coreoPhoto pipe to convert this into an absolute path for displaying or submitting the photo.

See the Ionic Native documentation for a list of options that can be passed to the two methods above.

• resolvePicturePath(file) - converts the filename returned from one of the above methods into an absolute path.

coreoPhoto pipe

You can use the pipe as an alternative to the resolvePicturePath method above, it's especially useful when working with <img> tags:

<img [src]="photo | coreoPhoto">

coreoPhotoBgUrl pipe

If you need to show the image as a background URL, you can use this pipe:

<div [style.background-image]="photo | coreoPhotoBgUrl"></div>

Why not return the absolute path?

iOS changes the locations of files stored inside the app's sandbox when the app's version number is upgraded. Storing absolute paths in the app would cause the paths to become invalid when the app is upgraded. See here for a more thorough discussion.