diff --git a/README.md b/README.md index c25893228..ebfa3a040 100644 --- a/README.md +++ b/README.md @@ -6,7 +6,7 @@ # 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 @@ -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. ``` -import { Geolocation } from 'ionic-native'; +import { Geolocation } from '@ionic-native/geolocation'; +import { Platform } from 'ionic-angular'; -Geolocation.getCurrentPosition().then(pos => { - console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude); -}); +@Component({ ... }) +export class MyComponent { -let watch = Geolocation.watchPosition().subscribe(pos => { - console.log('lat: ' + pos.coords.latitude + ', lon: ' + pos.coords.longitude); -}); - -// to stop watching -watch.unsubscribe(); -``` - -### 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; + constructor(private geolocation: Geolocation, private platform: Platform) { + + platform.ready().then(() => { + + // get position + geolocation.getCurrentPosition().then(pos => { + + console.log(`lat: ${pos.coords.latitude}, lon: ${pos.coords.longitude}`) + }); - }, 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