Ionic 3 - Open Native Settings plugin - ionic-framework

I stuck for days trying to make it work “open-native-settings” on my ionic 3 project,.
So, following the documentation,
https://ionicframework.com/docs/native/open-native-settings
add this on app.modules.ts:
import { OpenNativeSettings } from '#ionic-native/open-native-settings/ngx';
and add OpenNativeSettings in providers list.
Then en my .ts file:
import { OpenNativeSettings } from '#ionic-native/open-native-settings/ngx';
Adding on constructor:
constructor(private openNativeSettings: OpenNativeSettings) { }
but when trying call open() method I get:
(…) is not a function. (???)
this plugin work fine on Ionic 3??
I need try this on Ionic 3, not Ionic 4.
I know that /ngx is for Ionic 4. Then, I trying the normal method:
import { OpenNativeSettings } from ‘#ionic-native/open-native-settings’;
But doing this, I get this errors on the editor:
Error on source app.modules.ts
Error on source .ts file
any suggestions??
Thanks.

Have a look at this thread:
https://forum.ionicframework.com/t/ionic-native-issue-in-ionic-app/154152/19
I think the short answer is that to get this working in Ionic 3, you need to install the native plugin with the #4 version appended. Then import without the /ngx. But when working in Ionic 4, you need to do what you've done above. The only caveat is that you need to be consistent across all the native modules you use.

Related

How to add a Flutter API/Module in my app?

I am trying to make an anime app using Flutter. For that I needed an REST API but I fortunately found a dart API. The problem is I cannot understand how to incorporate it in my app. This would really help me reduce the work load.
I am attaching the github link.
https://github.com/charafau/jikan-dart
If you are talking about how to include a package in your flutter Application, then you need to do the following:
add the package dependencies in the pubspec.yaml file
Get the package by running pub get
and then import the packages in your app using import
steps by step instructions also available here: https://dart.dev/guides/packages
also if you check the utilization of the API in the example code, you can find this example:
import 'package:jikan_dart/jikan_dart.dart';
main() async {
var jikanApi = JikanApi();
var top = await jikanApi.getTop(TopType.manga, page: 2);
print('result $top');
}

How to integrate Leaflet into Angular 5

I've got the standard Angular 5 build and I'm trying to include a Leaflet map. The documentation gives me an error when I follow it. I'm trying to import Leaflet through NPM and include it but I can't find documentation.
I know I need the CSS, ID tag, and imports...
I've downloaded "leaflet" into my "node_modules folder".
Now what? What is the import code for the Leaflet module that I need to put into my "app.module.ts" file?
Firstly, for better development, install through npm #types/leaflet to get leaflet types in application. After that, you need to create component with Map property (imported from leaflet) and use factory function map (also imported from leaflet). The most of examples show configuration using id, but you can pass HTMLElement.
constructor(private element: ElementRef) {}
ngAfterViewInit() {
this.map = map(this.element.nativeElement, {...options})
}
At this moment, I develop library to integrated leaflet with Angular 5 using components. First stable will be released in next week, but I have first beta release on npm here.

How to integrate Cordoba Camera plugin in Ionic 1 project

I'm trying to implement a camera to my Ionic 1 project.
But I can't find any reliable examples of how to do that.
I found:
https://www.thepolyglotdeveloper.com/2014/09/use-android-ios-camera-ionic-framework/
and
https://github.com/apache/cordova-plugin-camera
and some older Stack Overflow entries.
Still, I haven't got it running myself.
You're on the right track already! What you found is the most popular camera plugin for Cordova:
https://github.com/apache/cordova-plugin-camera
This is a pure Cordova plugin though, meaning that it's not adjusted in any way for Ionic. This means, you just add it to your project and can use it as soon as Ionic is ready:
ionic.Platform.ready( function() {
navigator.camera.getPicture(onSuccess, onFail, options);
});
But passing callbacks as params is indeed not the angular way to do this. So on top of the basic Cordova camera plugin you can add ngCordova to enhance the handling.
To install and add ngCordova to your project follow these instructions:
http://ngcordova.com/docs/install/
To wrap it up:
Install ngCordova via bower
Add js reference to your index.html
Add the ngCordova module as a dependency to your app.js
In case you've added everything correctly, inject $cordovaCamera in your controller, directive or service to use it.
This allows you to access the camera the angular way, more about it you can find here:
http://ngcordova.com/docs/plugins/camera/
/**
* taken from the docs linked above
* you can now make use of promises here!
*/
$cordovaCamera.getPicture(options).then(function(imageData) {
var image = document.getElementById('myImage');
image.src = "data:image/jpeg;base64," + imageData;
}, function(err) {
// error
});
Hope this helps integrating the camera successfully in your project. ;)

How to use require in ionic 2

I want to use require.js in ionic 2.
I uses something like
var createLogger = require('redux-logger');
var persistState = require('redux-localstorage');
However, the browser complaint about "Uncaught ReferenceError: require is not defined". I could not think of a way to include requirejs to my ionic 2 project. Please help.
I am also trying to integrate RequireJs with Ionic 2.
For your problem try this
declare var require: any;
use it after all your imports and before #Component or #Service

how to know the name of the plugin when using with ionic-native?

I know the name of the plugin to add into the ionic2. However, when come to import it by using ionic-native, I don't know how to write it.
For example, my plugin is: cordova-plugin-ms-adal, and I install
ionic plugin add cordova-plugin-ms-adal
But how to import this plugin? Is the following correct?
import {MSADAL} from 'ionic-native';
The quickest way is to dive straight into the source code of Ionic Native, you can find it GitHub. If we take the Geolocation plugin for example, you can see the following in the code:
export class Geolocation
This means that Geolocation is the name of the plugin you need to import.
However, in your case there is a simple explanation as to why it doesn't work. The cordova-plugin-ms-adal is simply not supported in Ionic Native. You could either create the implementation yourself and create a pull request to get it merged into the library or open an issue on GitHub.