2017-07-31 78 views
0

我正在使用条纹付款处理付款。我跟着这个GITHUB项目和这个blog条纹结算不能在角度1.x中工作

我的项目具有嵌套的视图并使用路由器。

我的项目结构看起来像

src 
    app 
    views 
    controllers 
    directives 
    index.html 
    app.js 

的app.js是其中角模块被手动加载并具有路由器。

app.js

var myApp = angular.module('myApp', ['ui.router', 'formData']); 
myApp.config(function($stateProvider, $urlRouterProvider, $httpProvider) { 
    // routers 
} 

中的index.html是其中角和条纹脚本被包括

的index.html

<head lang="en"> 
    <script type="text/javascript" src="https://js.stripe.com/v2/"></script> 
    <Script src="resources/angular.min.js"></Script> 
    <Script src="resources/angular-ui-router.min.js"></Script> 
    <script src="app.js"></script> 
    <script src="directives/formData/formData.js"></script> 
    <script type="text/javascript" 
     src="resources/angular-payments.js"> 
    </script> 
    <script> 
     Stripe.setPublishableKey('key') 
    </script> 
</head> 
<div> 
    <div ui-view> 
    </div> 
</div> 

Ñ流的FORMDATA指令是在那里我想包括条支付

formData.js

var formData = angular.module('formData',['angularPayments']); 
formData.directive('formData',function(){ 
    return { 
     restrict: 'EA', 
     scope: {}, 
     replace: true, 
     link: function($scope, element, attributes){ 

     }, 
     controller: function($scope,$attrs,$http, $state){ 
      //This is the callback for strip from the links above as followed 
      $scope.stripeCallback = function (code, result) { 
       console.log("inside cc callbakc"); 
       if (result.error) { 
        console.log("credit card error"); 
        window.alert('it failed! error: ' + result.error.message); 
       } else { 
        console.log(result); 
        console.log("credit card succes "+result.id); 
        window.alert('success! token: ' + result.id); 
       } 
      }; 

     }, 
     templateUrl: 'directives/formData/formData.tpl.html' 
    } 
}); 

formData.tpl.html有另一个UI路由器

formData.tpl .html

<form id="signup-form" ng-submit="processForm()"> 
    <!-- our nested state views will be injected here --> 
    <div ui-view></div 
</form> 

和UI路由器html页面的一个是付款页面,此代码

<form stripe-form="stripeCallback" name="checkoutForm">> 
    <input ng-model="number" placeholder="Card Number" 
      payments-format="card" payments-validate="card" name="card" /> 
    <input ng-model="expiry" placeholder="Expiration" 
      payments-format="expiry" payments-validate="expiry"     
      name="expiry" /> 
    <input ng-model="cvc" placeholder="CVC" payments-format="cvc" payments-validate="cvc" name="cvc" /> 
    <button type="submit">Submit</button> 
</form> 

我在控制台中工作的验证,但不执行打印作业时,我打提交。我猜js没有被解雇。如果您需要更多信息,请与我们联系。

回答

1

这将渲染为嵌套窗体,这是无效的html。大多数浏览器通过将内部表单视为非表单元素来默默“宽恕”这一点。 如果您将checkoutForm从注册表单中移出,这应该使您走上正确的轨道。

+0

是的,如果我在注册表单之外有这个工作。但我真的需要这里面 – ksernow