awesome-cordova-plugins/README.md

96 lines
3.4 KiB
Markdown
Raw Normal View History

2016-03-15 02:15:01 +08:00
[![Circle CI](https://circleci.com/gh/driftyco/ionic-native.svg?style=shield)](https://circleci.com/gh/driftyco/ionic-native) [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)
2016-09-26 05:57:38 +08:00
[![npm](https://img.shields.io/npm/l/express.svg)](https://www.npmjs.com/package/ionic-native)
2016-03-15 02:15:01 +08:00
[![NPM](https://nodei.co/npm/ionic-native.png?stars&downloads)](https://nodei.co/npm/ionic-native/)
2016-09-26 05:58:32 +08:00
[![NPM](https://nodei.co/npm-dl/ionic-native.png?months=6&height=2)](https://nodei.co/npm/ionic-native/)
2016-03-15 02:15:01 +08:00
2015-11-28 13:05:15 +08:00
# Ionic Native
2016-02-19 01:54:23 +08:00
Ionic Native is a curated set of wrappers for Cordova plugins that make adding any native functionality you need to your [Ionic](http://ionicframework.com/), Cordova, or Web View mobile app easy.
2016-05-10 00:01:51 +08:00
### Documentation
For the full Ionic Native documentation, please visit [http://ionicframework.com/docs/v2/native/](http://ionicframework.com/docs/v2/native/).
2016-02-19 01:54:23 +08:00
### Promises and Observables
Ionic Native wraps plugin callbacks in a Promise or [Observable](https://gist.github.com/staltz/868e7e9bc2a7b8c1f754), providing a common interface for all plugins and ensuring that native events trigger change detection in Angular 2.
```
import { Geolocation } from 'ionic-native';
2016-02-19 01:54:23 +08:00
2016-08-02 03:25:55 +08:00
Geolocation.getCurrentPosition().then(pos => {
2016-02-19 01:54:23 +08:00
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
});
let watch = Geolocation.watchPosition().subscribe(pos => {
2016-02-19 01:54:23 +08:00
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
});
// to stop watching
watch.unsubscribe();
```
2016-07-28 22:28:58 +08:00
### Angular 1
2016-07-29 00:44:14 +08:00
Ionic Native works as a stand-in for [ngCordova](http://ngcordova.com/). In many cases, the usage is identical, but we import `ionic.native` instead of `ngCordova` as our module.
2016-07-28 22:28:58 +08:00
As a rule of thumb: take the ES6 class name of the plugin and add `$cordova` to get the service name. For example, `Geolocation` would be `$cordovaGeolocation`, and `Camera` will be `$cordovaCamera`:
```javascript
angular.module('myApp', ['ionic', 'ionic.native'])
.controller('MyCtrl', function($scope, $cordovaCamera) {
$scope.takePicture = function() {
$cordovaCamera.getPicture(opts).then(function(p) {
}, function(err) {
});
};
});
```
2016-08-02 03:25:55 +08:00
For services that return observables, the Angular 1 digest cycle must be done manually (currently):
```javascript
angular.module('myApp', ['ionic', 'ionic.native'])
.controller('MyCtrl', function($scope, $cordovaGeolocation) {
$scope.takePicture = function() {
$cordovaGeolocation.watchPosition(opts).subscribe(function(p) {
$scope.$apply(function() {
$scope.position = p.coords;
});
}, function(err) {
});
};
});
```
2016-02-19 01:54:23 +08:00
### Runtime Diagnostics
Spent way too long diagnosing an issue only to realize a plugin wasn't firing or installed? Ionic Native lets you know what the issue is and how you can resolve it.
2016-07-27 02:34:53 +08:00
![img](http://ionic-io-assets.s3.amazonaws.com/ionic-native-console.png)
2016-02-27 01:31:21 +08:00
## Installation
2015-11-29 08:36:38 +08:00
2016-08-02 03:25:55 +08:00
Run following commmand to install ionic-native in your project.
2016-02-26 21:02:07 +08:00
```
npm install ionic-native --save
```
2016-02-27 01:31:21 +08:00
## Plugin Missing?
Let us know or submit a PR! Take a look at [the Developer Guide](https://github.com/driftyco/ionic-native/blob/master/DEVELOPER.md) for more on how to contribute. :heart:
2015-11-29 08:36:38 +08:00
# Credits
2017-01-24 11:22:19 +08:00
Ibby Hadeed - [@ihadeed](http://github.com/ihadeed)
2016-03-16 03:12:21 +08:00
2016-02-11 00:07:19 +08:00
Tim Lancina - [@timlancina](http://twitter.com/timlancina)
2015-11-29 08:36:38 +08:00
Max Lynch - [@maxlynch](http://twitter.com/maxlynch)
Rob Wormald - [@robwormald](https://twitter.com/robwormald)