单击共享按钮时未加载社交共享

Question

I'm did the instalation of SocialSharing Plugin on ionic 3. I instaled it folowing documentation of ionic and from repository with ionic cordova plugin add https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin.git

But when I click on the button, nothing rappen.

I tried many methods, but when I install it on phone and click on the buttons bellow with example methods, nothing rappens.

home.html:

   <button ion-button block onclick="this.socialSharing.share(null, 'Android filename', 'data:image/png;base64,R0lGODlhDAAMALMBAP8AAP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAUKAAEALAAAAAAMAAwAQAQZMMhJK7iY4p3nlZ8XgmNlnibXdVqolmhcRQA7', null)">base64 image only</button>

    <br>

    <button ion-button block onclick="this.socialSharing.shareViaWhatsApp('Message via WhatsApp', null /* img */, null /* url */, function() {console.log('share ok')}, function(errormsg){alert(errormsg)})">msg via WhatsApp (with errcallback)</button>


    <br>


    <button ion-button block onclick="this.socialSharing.canShareVia('whatsapp', 'msg', null, null, null, function(e){alert(e)}, function(e){alert(e)})">is WhatsApp available?</button>

    <br>

    <button ion-fab class="share" mini onclick="this.socialsharing.share('null', 'null', 'https://www.google.nl/images/srpr/logo4w.png', null)">Share</button>

home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {AlertController} from 'ionic-angular';
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
import { SocialSharing } from '@ionic-native/social-sharing/ngx';


declare let DatecsPrinter:any;
declare var window: any;
declare var require: any;
var QRCode = require('qrcode');

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

    DatecsPrinter: any;
    public printerslist;
    public status = "Failure";
    public feedlines:Number = 1;
    listBluetoothDevices:any=[];

    constructor(public navCtrl: NavController, private alertCtrl: AlertController, private iab: InAppBrowser, private socialSharing: SocialSharing) {
        this.getPrintersList();

    }

config.xml

[...]
<plugin name="cordova-plugin-whitelist" spec="1.3.3" />
<plugin name="cordova-plugin-statusbar" spec="2.4.2" />
<plugin name="cordova-plugin-device" spec="2.0.2" />
<plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
<plugin name="cordova-plugin-ionic-webview" spec="^4.0.0" />
<plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
<plugin name="cordova-plugin-datecs-printer" spec="https://github.com/giorgiofellipe/cordova-plugin-datecs-printer.git" />
<plugin name="cordova-plugin-inappbrowser" spec="3.1.0" />
<plugin name="cordova-plugin-x-socialsharing" spec="^5.17.1" />
<engine name="android" spec="7.1.4" />

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
import { SocialSharing } from '@ionic-native/social-sharing/ngx';


@NgModule({
  declarations: [
    MyApp,
    HomePage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    InAppBrowser,
    SocialSharing,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

Someone already got this problem before?

Thanks!

Answer 1

**you calling the function in Html file. move the functions in ts file.**

home.html
<button ion-button block (click)="socialSharing()">base64 image only</button>

home.ts
socialSharing(){
  this.socialSharing.share(
     null, 
    'Android filename', 
    'file', 
    null
  )
}