การแชร์ข้อมูลใน ionic material ด้วย social sharing plugin

C:\phonegap\learn003>cordova plugin add cordova-plugin-x-socialsharing

  $cordovaSocialSharing
    .share(message, subject, file, link) // Share via native share sheet
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occured. Show a message to the user
    });

.share(message, subject, file, link)

var options = {
	message: message, // not supported on some apps (Facebook, Instagram)
	subject: message, // fi. for email
	files: image, // an array of filenames either locally or remotely
	url: e.url,
	chooserTitle: 'Pick an app' // Android only, you can override the default share sheet title
}
$cordovaSocialSharing
	.shareWithOptions(options) // Share via native share sheet
	.then(function(result) {
		alert("Success");
	}, function(err) {
		alert("error");
	});

  $cordovaSocialSharing
    .share(message, subject, file, link) // Share via native share sheet
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occured. Show a message to the user
    });

  $cordovaSocialSharing
    .shareViaTwitter(message, image, link)
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occurred. Show a message to the user
    });

  $cordovaSocialSharing
    .shareViaWhatsApp(message, image, link)
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occurred. Show a message to the user
    });

  $cordovaSocialSharing
    .shareViaFacebook(message, image, link)
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occurred. Show a message to the user
    });

  // access multiple numbers in a string like: '0612345678,0687654321'
  $cordovaSocialSharing
    .shareViaSMS(message, number)
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occurred. Show a message to the user
    });

// toArr, ccArr and bccArr must be an array, file can be either null, string or array
  $cordovaSocialSharing
    .shareViaEmail(message, subject, toArr, ccArr, bccArr, file)
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occurred. Show a message to the user
    });

  $cordovaSocialSharing
    .canShareVia(socialType, message, image, link)
    .then(function(result) {
      // Success!
    }, function(err) {
      // An error occurred. Show a message to the user
    });

  $cordovaSocialSharing
    .canShareViaEmail()
    .then(function(result) {
      // Yes we can
    }, function(err) {
      // Nope
    });

ng-click="openurl('{{article.url}}','_blank','{{article.topic}}','{{article.img}}')"

<ion-view view-title="Article">
    <ion-nav-buttons side="right">
        <div class="buttons buttons-right header-item">
    <span class="right-buttons">
    <button class="button button-icon button-clear ion-android-more-vertical"> </button>
    </span>
        </div>
    </ion-nav-buttons>
    <ion-content class="stable-bg" ng-class="{expanded:isExpanded}">
        <ion-refresher on-refresh="refresh()"></ion-refresher>
        <div ng-show="!articles.length">
            <div style="text-align: center;">
                <h4>Pull to refresh</h4>
            </div>
        </div>
        <div class="list card light-bg" ng-repeat="article in articles">
            <div class="item item-avatar">
                <img ng-src="{{article.img}}">
                <h2>{{article.topic}}</h2>
                <p>{{article.date}}</p>
            </div>

            <div class="item item-body"
                 ng-click="openurl('{{article.url}}','_blank','{{article.topic}}','{{article.img}}')">
                <img ng-src="{{article.img}}" alt="" style="margin: auto;">
                <p>
                    {{article.description}}
                </p>
                <p>{{article.view}} views</p>

            </div>
        </div>


    </ion-content>
</ion-view>

$scope.openurl = function(url, target, message, image){

menu: {
	wwwImage: 'img/ic_more_vert_black_48dp.png',
	wwwImagePressed: 'img/ic_more_vert_black_48dp.png',
	wwwImageDensity: 2,
	align: 'right',
	items: [
		{
			event: 'sharetofacebook',
			label: 'Share to facebook!'
		},
		{
			event: 'sharetoemail',
			label: 'Send to Email'
		}
	]
},

.controller('ArticleCtrl', function(
    $scope, $stateParams, $timeout, ionicMaterialInk, ionicMaterialMotion
    ,$ionicPlatform, ArticleService, $cordovaToast, $cordovaSpinnerDialog
    ,$cordovaSocialSharing) {
    $scope.$parent.showHeader();
    $scope.$parent.clearFabs();
    $scope.$parent.setHeaderFab(false);
    $scope.$parent.hasShadow();

    $timeout(function() {
        $scope.isExpanded = false;
        $scope.$parent.setExpanded(false);
    }, 300);

    // สร้างฟังก์ชั่นสำหรับเรียกใช้ Toast plugin
    $scope.showToast = function(str, duration, position){
        $ionicPlatform.ready(function() { // เตรียมก่อนเรียกใช้ plugin
            return $cordovaToast
                .show(str, duration, position)
                .then(function(success) {
                    // success
                }, function (error) {
                    // error
                });
        });
    };

    // สร้างฟังก์ชั่นสำหรับเปิดเว็บเพจ รับค่า url  target message image
    $scope.openurl = function(url, target, message, image){

        $ionicPlatform.ready(function() { // เตรียมก่อนเรียกใช้ plugin
            // เรียกให้ plugin ทำงานหร้อมปรับแต่งการแสดงผล
            cordova.ThemeableBrowser.open(url, target, {
                statusbar: {
                    color: '#ffffffff'
                },
                toolbar: {
                    height: 44,
                    color: '#f0f0f0ff'
                },
                title: {
                    color: '#003264ff',
                    showPageTitle: true
                },
                backButton: {
                    wwwImage: 'img/ic_chevron_left_black_48dp.png',
                    wwwImagePressed: 'img/ic_chevron_left_black_48dp.png',
                    wwwImageDensity: 2,
                    align: 'left',
                    event: 'backPressed' // กด back ให้ทำงานที่ backPressed
                },
                forwardButton: {
                    wwwImage: 'img/ic_chevron_right_black_48dp.png',
                    wwwImagePressed: 'img/ic_chevron_right_black_48dp.png',
                    wwwImageDensity: 2,
                    align: 'left',
                    event: 'forwardPressed'
                },
                closeButton: {
                    wwwImage: 'img/ic_close_black_48dp.png',
                    wwwImagePressed: 'img/ic_close_black_48dp.png',
                    wwwImageDensity: 2,
                    align: 'left',
                    event: 'closePressed'
                },
                customButtons: [
                    {
                        wwwImage: 'img/ic_share_black_48dp.png',
                        wwwImagePressed: 'img/ic_share_black_48dp.png',
                        wwwImageDensity: 2,
                        align: 'right',
                        event: 'sharePressed'
                    }
                ],
                menu: {
                    wwwImage: 'img/ic_more_vert_black_48dp.png',
                    wwwImagePressed: 'img/ic_more_vert_black_48dp.png',
                    wwwImageDensity: 2,
                    // title: 'Test',
                    // cancel: 'Cancel',
                    align: 'right',
                    items: [
                        {
                            event: 'sharetofacebook',
                            label: 'Share to facebook!'
                        },
                        {
                            event: 'sharetoemail',
                            label: 'Send to Email'
                        }
                    ]
                },
                backButtonCanClose: true
            }).addEventListener('backPressed', function(e) {
                $scope.showToast('ทำการกดปุ่ม Back', 'long', 'bottom');
            }).addEventListener('forwardPressed', function(e) {
                $scope.showToast('ทำการกดปุ่ม forward', 'long', 'bottom');
            }).addEventListener('sharetofacebook', function(e) {
                $scope.showToast('Share to facebook', 'long', 'bottom');

                $cordovaSocialSharing
                    .shareViaFacebook(message, null, e.url)
                    .then(function(result) {
                        alert("Success");
                    }, function(err) {
                        alert("error");
                    });
            }).addEventListener('sharetoemail', function(e) {
                $scope.showToast('Share to Email', 'long', 'bottom');
                $cordovaSocialSharing
                    .shareViaEmail(message, message, [], [], [], image)
                    .then(function(result) {
                        alert("Success");
                    }, function(err) {
                        alert("error");
                    });
            }).addEventListener('sharePressed', function(e) {
                $scope.showToast('ทำการกดปุ่ม share URL=' + e.url, 'long', 'bottom');

                var options = {
                    message: message, // not supported on some apps (Facebook, Instagram)
                    subject: message, // fi. for email
                    files: image, // an array of filenames either locally or remotely
                    url: e.url,
                    chooserTitle: 'Pick an app' // Android only, you can override the default share sheet title
                }
                $cordovaSocialSharing
                    .shareWithOptions(options) // Share via native share sheet
                    .then(function(result) {
                        alert("Success");
                    }, function(err) {
                        alert("error");
                    });
            }).addEventListener(cordova.ThemeableBrowser.EVT_ERR, function(e) {
                $scope.showToast('แจ้ง error:' +e.message, 'long', 'bottom');
            }).addEventListener(cordova.ThemeableBrowser.EVT_WRN, function(e) {
                $scope.showToast('เตือน warning:' +e.message, 'long', 'bottom');
            });

        });

    };


    // กำหนดตัวแปร สำหรับไว้รับค่าข้อมูลบทความ
    $scope.articles = [];


     // สร้างฟังก์ชั่นสำหรับไปดึงข้อมูลจาก server
    $scope.refresh = function(){
        $ionicPlatform.ready(function() { // เตรียมก่อนเรียกใช้ plugin
            // เรียกใช้ ArticleService ให้ทำงานฟังก์ชั่น getArticle
            ArticleService.getArticle()
                .then(function (response) {
                    $cordovaSpinnerDialog.hide();
                    // นำผลลัพธ์ที่ได้เก็บในตัวแปร $scope.articles
                    $scope.articles = response;
                    // ซ่อนหลังจาก ข้อมูลแสดงแล้ว
                    $scope.$broadcast("scroll.refreshComplete");
                });
        });
    };

    // เราจะให้ทำการโหลดข้อมลเมื่อเข้ามาหน้า article แต่แรก
    // และให้แสดง loading
    $ionicPlatform.ready(function() { // เตรียมก่อนเรียกใช้ plugin
        // แสดง spin dialog plugin จะใช้หรือไม่ก็ได้ นำมาใช้เผื่อใครไปประยุกต์เพิ่ม
        $cordovaSpinnerDialog.show(null,"รอสักครู่..กำลังโหลดข้อมูล"); // แสดง loading
        $scope.refresh();
    });



    ionicMaterialMotion.fadeSlideInRight();

    ionicMaterialInk.displayEffect();

})

C:\phonegap\learn003>phonegap build android