简体   繁体   中英

Social sharing plugin not working in Ionic Cordova

I have installed social sharing plugin in my Ionic app for ngCordova.

cordova plugin add https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin.git

I have implemented it in my app, as shown in instructions.

But it shows 'socialsharing of undefined' error in console. I have also build it for android and tried running on my device in debug mode, still it shows same error for webview.

Does anyone know why this is not working?

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link rel="manifest" href="manifest.json">

    <!-- un-comment this code to enable service worker
    <script>
      if ('serviceWorker' in navigator) {
        navigator.serviceWorker.register('service-worker.js')
          .then(() => console.log('service worker installed'))
          .catch(err => console.log('Error', err));
      }
    </script>-->

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
   <script src="lib/ngCordova/dist/ng-cordova.js"></script> 
<!--     <script src="js/cordova.js"></script>
 -->
    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="http://maps.google.com/maps/api/js?key=AIzaSyCQsTMbMnnBg8qbneW1oY4PEzN12gEF25M&sensor=true"></script>
    <script src= "https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
  </head>

  <body ng-app="starter">
    <ion-nav-view></ion-nav-view>
  </body>
</html>

app.js

// Ionic Starter App
angular.module('starter', ['ionic', 'starter.controllers','ngCordova']).run(function ($ionicPlatform) {
  $ionicPlatform.ready(function () {
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if (window.StatusBar) {
    StatusBar.styleDefault();
    }
  });
}).config(function ($stateProvider, $urlRouterProvider) {
  $stateProvider.state('app', {
    url: '/app'
    , abstract: true
    , templateUrl: 'templates/menu.html'
    , controller: 'AppCtrl'
  })
      .state('app.register', {
    url: '/register'
    , views: {
      'menuContent': {
        templateUrl: 'templates/register.html'
        , controller: 'RegisterCtrl'
      }
    }
  })
            .state('app.login', {
    url: '/login'
    , views: {
      'menuContent': {
        templateUrl: 'templates/login.html'
        , controller: 'LoginCtrl'
      }
    }
  })
      .state('app.sports', {
    url: '/sports'
    , views: {
      'menuContent': {
        templateUrl: 'templates/sports.html'
        , controller: 'SportsCtrl'
      }
    }
  })
  .state('app.arenabylist', {
    url: '/arenabylist?sport_id&sport_icon&sport_name'
    , views: {
      'menuContent': {
        templateUrl: 'templates/arenabylist.html',
        controller: 'ArenaByListCtrl'
      }
    }
  })
  .state('app.arenadetail', {
    url: '/arenadetail?arena_id&sport_id'
    , views: {
      'menuContent': {
        templateUrl: 'templates/arenadetail.html'
        , controller: 'ArenaDetailCtrl'
      }
    }
  })
  .state('app.search', {
    url: '/search'
    , views: {
      'menuContent': {
        templateUrl: 'templates/search.html'
        , controller: 'searchCtrl'
      }
    }
  })
  .state('app.otpVerification', {
    url: '/otpVerification'
    , views: {
      'menuContent': {
        templateUrl: 'templates/otpVerification.html'
       , controller: 'OtpVerificationCtrl'
      }
    }
  })
 .state('app.startupscreen', {
    url: '/startupscreen'
    , views: {
      'menuContent': {
        templateUrl: 'templates/startupscreen.html'
        , controller: 'StartupScreenCtrl'
      }
    }
  })
  .state('app.feedback', {
    url: '/feedback'
    , views: {
      'menuContent': {
        templateUrl: 'templates/feedback.html'
        , controller: 'FeedbackCtrl'
      }
    }
  })
  .state('app.about', {
    url: '/about'
    , views: {
      'menuContent': {
        templateUrl: 'templates/about.html'
        , controller: 'AboutCtrl'
      }
    }
  })
   .state('app.locationDetail', {
    url: '/locationDetail'
    , views: {
      'menuContent': {
        templateUrl: 'templates/locationDetail.html'
        , controller: 'LocationDetailCtrl'
      }
    }
  })
  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/app/startupscreen');
})


 .directive("moveNextOnMaxlength", function() {
   return {
       restrict: "A",
       link: function($scope, element) {
           element.on("input", function(e) {
               if(element.val().length == element.attr("maxlength")) {
                   var $nextElement = element.next();
                   if($nextElement.length) {
                       $nextElement[0].focus();
                   }
               }
           });
       }
   }
});

controller

angular.module('starter.controllers',[])
.controller('Social', ['$scope', function($scope){
    $scope.share = function(t, msg, img, link){  
        if(t == 'w')
            window.plugins.socialsharing
            .shareViaWhatsApp(msg, '', link);
        else if(t == 'f')
            window.plugins.socialsharing
            .shareViaFacebook(msg, img, link);    
        else if(t == 't')
            window.plugins.socialsharing
            .shareViaTwitter(msg, img, link);    
        else if(t == 'sms')
            window.plugins.socialsharing
            .shareViaSMS(msg+' '+img+' '+link);    
        else
        {
            var sub = 'Beautiful images inside ..';
            window.plugins.socialsharing
            .shareViaEmail(msg, sub, '');        
        }    
    }
}])

This is the problem:

<!--     <script src="js/cordova.js"></script>
 -->

Cordova is commented out, so it is never loaded. As described in the ngCordova documentation , you need to have the following:

<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>

You will have to manually add few lines in config.xml. Please refer https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin#manually

I think this helps.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM