github/awesome-cordova-plugins
github/awesome-cordova-plugins
2
0
Fork 1
mirror of https://github.com/danielsogl/awesome-cordova-plugins.git synced 2025-01-19 08:32:52 +08:00
Code Issues Projects Releases Wiki Activity

chore(): update readme

Browse Source
This commit is contained in:
Ibby 2017-03-20 16:46:08 -04:00
parent 2f2d55f1d5
commit 5da4732787
1 changed files with 30 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
README.md
View File

@ -6,7 +6,7 @@
# Ionic Native # Ionic Native
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. Ionic Native is a curated set of wrappers for Cordova plugins that make adding any native functionality you need to your [Ionic 2](http://ionicframework.com/) mobile app easy.
### Documentation ### Documentation
@ -17,53 +17,39 @@ For the full Ionic Native documentation, please visit [http://ionicframework.com
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. 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'; import { Geolocation } from '@ionic-native/geolocation';
import { Platform } from 'ionic-angular';
Geolocation.getCurrentPosition().then(pos => { @Component({ ... })
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude); export class MyComponent {
});
let watch = Geolocation.watchPosition().subscribe(pos => { constructor(private geolocation: Geolocation, private platform: Platform) {
console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude);
}); platform.ready().then(() => {
// to stop watching // get position
watch.unsubscribe(); geolocation.getCurrentPosition().then(pos => {
```
console.log(`lat: ${pos.coords.latitude}, lon: ${pos.coords.longitude}`)
### Angular 1
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.
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) {
});
};
});
```
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) {
// watch position
const watch = geolocation.watchPosition().subscribe(pos => {
console.log(`lat: ${pos.coords.latitude}, lon: ${pos.coords.longitude}`)
});
// to stop watching
watch.unsubscribe();
}); });
};
}); }
}
``` ```
### Runtime Diagnostics ### Runtime Diagnostics