javascript - 获取 Stripe token 后如何以表单发送附加用户信息 - Angular

Question

因此，我使用 Stripe 接受表单上的付款，该表单还包含其他信息 - 姓名 - 地址等。我正在使用以下库:

https://github.com/gtramontina/stripe-angular

我的表单设置如下:

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

以及嵌套表单 View 的示例(非 Stripe 内容)

<div class="form-group">
    <label for="name">Name</label>
    <input type="text" class="form-control" name="name" ng-model="formData.name" required>
</div>

还有 Stripe :

<div class="form-group">
    <label for="card_number">Card Number</label>
      <input type="text" class="form-control" size="20" data-stripe="number" ng-model="formData.card"/>
    </div>

我的 Controller (仅相关功能):

// function to process the form
    $scope.saveCustomer = function(status, response) {
            var $form = $('#signup-form');

            if (response.error) {
                // Show the errors on the form
                $form.find('.payment-errors').text(response.error.message);
                $form.find('button').prop('disabled', false);
              } else {
                // response contains id and card, which contains additional card details
                var token = response.id;
                var html = '<input type="hidden" name="stripeToken" ng-model=formData.'+token+'/>';
                // Insert the token into the form so it gets submitted to the server
                $form.append($(html));
                // and submit
                $form.get(0).submit();
                console.log(formData);
             }
        }

这是我的问题 - 如果“saveCustomer”函数相当于 stripe 文档中的 stripeResponseHandler 函数，那么他们将在将 token 附加到表单后提交表单。如果我要将数据添加到 formData 对象中，如何将此信息添加到该对象中。我现在的逻辑是，我在 Controller 中添加链接到另一个函数(processForm)的 ng-submit 属性，但这似乎很垃圾，而且我无论如何都无法获取数据 - 我如何获取 token 和所有其他 formData 数据如果我在 saveCustomer 函数中看不到 formData，是否将其放入单个函数中以将其发送到服务器？

Answer 1

直接使用 jquery 处理 DOM 与 Angular 方式不符。我建议你使用模型对象而不是处理 DOM。在您的示例代码中，模型对象是“formData”。

如果您想访问 $scope.formData，下面的代码可以帮助您做到这一点。

$scope.formData = {}; 
var formData = $scope.formData;

$scope.saveCustomer = function(status, response) { 
    console.log(formData); // NOT $scope.formData; 
}