您好我正在使用此链接将paypal集成到离子应用程序中
当我点击按钮开始支付宝付款时，我收到了该错误。 我已经在js文件夹中添加了所有文件，并在index.html中添加了它们的引用
ionic.bundle.js:26799 ReferenceError: PaypalService is not defined
at ChildScope.$scope.click (app.js:36)
at fn (eval at compile (ionic.bundle.js:27643), <anonymous>:4:206)
at ionic.bundle.js:65429
at ChildScope.$eval (ionic.bundle.js:30400)
at ChildScope.$apply (ionic.bundle.js:30500)
at HTMLButtonElement.<anonymous> (ionic.bundle.js:65428)
at defaultHandlerWrapper (ionic.bundle.js:16792)
at HTMLButtonElement.eventHandler (ionic.bundle.js:16780)
at triggerMouseEvent (ionic.bundle.js:2953)
at tapClick (ionic.bundle.js:2942)
我的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="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/paypal-mobile-js-helper.js"></script>
<script src="js/cdv-plugin-paypal-mobile-sdk.js"></script>
<script src="js/payPalService.js"></script>
</head>
<body ng-app="starter" ng-controller="MyCtrl">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content>
<button ng-click="click()"> payment</button>
</ion-content>
</ion-pane>
</body>
</html>
app.js文件
// Ionic Starter App
// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
angular.module('starter', ['ionic'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
// Don't remove this line unless you know what you are doing. It stops the viewport
// from snapping when text inputs are focused. Ionic handles this internally for
// a much nicer keyboard experience.
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
//.service('myService', function () { /* ... */ })
.controller('MyCtrl' , function($scope){
$scope.click=function()
{
console.log("i am call");
// console.log(error);
PaypalService.initPaymentUI().then(function () {
PaypalService.makePayment(90, "Total Amount").then(function (response) {
alert("success"+JSON.stringify(response));
}, function (error) {
alert('Transaction Canceled');
});
});
};
})
.constant('shopSettings',{
payPalSandboxId :'Aar8HZzvc5NztVWodTBpOiOod9wWrBDrJUjyvRr4WsxcCD28xYig7oecfYsqxQUDu5QHptPpSALirxZD',
payPalProductionId : 'production id here',
payPalEnv: 'PayPalEnvironmentSandbox', // for testing production for production
payPalShopName : 'MyShopName',
payPalMerchantPrivacyPolicyURL : 'url to policy',
payPalMerchantUserAgreementURL : ' url to user agreement'
})
paypalServices.js
var app=angular.module('starter.payPalService', [])
app.factory('PaypalService', ['$q', '$ionicPlatform', 'shopSettings', '$filter', '$timeout', function ($q, $ionicPlatform, shopSettings, $filter, $timeout) {
var init_defer;
/**
* Service object
* @type object
*/
var service = {
initPaymentUI: initPaymentUI,
createPayment: createPayment,
configuration: configuration,
onPayPalMobileInit: onPayPalMobileInit,
makePayment: makePayment
};
/**
* @ngdoc method
* @name initPaymentUI
* @methodOf app.PaypalService
* @description
* Inits the payapl ui with certain envs.
*
*
* @returns {object} Promise paypal ui init done
*/
function initPaymentUI() {
init_defer = $q.defer();
$ionicPlatform.ready().then(function () {
var clientIDs = {
"PayPalEnvironmentProduction": shopSettings.payPalProductionId,
"PayPalEnvironmentSandbox": shopSettings.payPalSandboxId
};
PayPalMobile.init(clientIDs, onPayPalMobileInit);
});
return init_defer.promise;
}
/**
* @ngdoc method
* @name createPayment
* @methodOf app.PaypalService
* @param {string|number} total total sum. Pattern 12.23
* @param {string} name name of the item in paypal
* @description
* Creates a paypal payment object
*
*
* @returns {object} PayPalPaymentObject
*/
function createPayment(total, name) {
// "Sale == > immediate payment
// "Auth" for payment authorization only, to be captured separately at a later time.
// "Order" for taking an order, with authorization and capture to be done separately at a later time.
var payment = new PayPalPayment("" + total, "EUR", "" + name, "Sale");
return payment;
}
/**
* @ngdoc method
* @name configuration
* @methodOf app.PaypalService
* @description
* Helper to create a paypal configuration object
*
*
* @returns {object} PayPal configuration
*/
function configuration() {
// for more options see `paypal-mobile-js-helper.js`
var config = new PayPalConfiguration({merchantName: shopSettings.payPalShopName, merchantPrivacyPolicyURL: shopSettings.payPalMerchantPrivacyPolicyURL, merchantUserAgreementURL: shopSettings.payPalMerchantUserAgreementURL});
return config;
}
function onPayPalMobileInit() {
$ionicPlatform.ready().then(function () {
// must be called
// use PayPalEnvironmentNoNetwork mode to get look and feel of the flow
PayPalMobile.prepareToRender(shopSettings.payPalEnv, configuration(), function () {
$timeout(function () {
init_defer.resolve();
});
});
});
}
/**
* @ngdoc method
* @name makePayment
* @methodOf app.PaypalService
* @param {string|number} total total sum. Pattern 12.23
* @param {string} name name of the item in paypal
* @description
* Performs a paypal single payment
*
*
* @returns {object} Promise gets resolved on successful payment, rejected on error
*/
function makePayment(total, name) {
var defer = $q.defer();
total = $filter('number')(total, 2);
$ionicPlatform.ready().then(function () {
PayPalMobile.renderSinglePaymentUI(createPayment(total, name), function (result) {
$timeout(function () {
defer.resolve(result);
});
}, function (error) {
$timeout(function () {
defer.reject(error);
});
});
});
return defer.promise;
}
return service;
}]);
答案 0 :(得分：2)
由于您将starter.payPalService声明为单独的模块，因此需要将其注入父模块，
angular.module('starter', ['ionic','starter.payPalService'])
在控制器中，确保注入服务，
.controller('MyCtrl' , function($scope,PaypalService){
}