angular2在打字稿中提交表单

Question

我需要提交来自支付网关的表单。我们的后端人员要求我输入innerHtml 并在渲染后发送。我让它在 Chrome 上运行，但在 Firefox 上失败了。

现在我正在尝试在我们的测试环境中修复它，后端添加了一个 JSON 返回，其中包含我需要复制他发送给我的表单的所有属性，以便我可以制作自己的表单。但仍然无法在 Firefox 上提交。

有人有同样的经历吗？请给我一些启发。

我需要知道任何 Firefox 特定的修复吗？

以下是 Chrome 和 Safari 上的工作代码

import { Component, OnInit, AfterViewInit, ViewChild, ElementRef,DoCheck, ViewChildren, QueryList } from '@angular/core';
import { BrowserModule, DomSanitizer, SafeResourceUrl, SafeUrl} from '@angular/platform-browser';
import { PaymentService } from '../../_services/payment.service';
import { Loader } from '../../_services/loader.service';

@Component({
  selector: 'bdf-payment-form',
  templateUrl: './payment-form.component.html',
  styleUrls: ['./payment-form.component.scss']
})
export class PaymentFormComponent implements OnInit,DoCheck, AfterViewInit  {

  form : SafeResourceUrl;
  // @ViewChild('paymentFormContainer') container: ElementRef;
  @ViewChild('paymentForm') myForm: ElementRef;
  loader;
  constructor(private paymentService:PaymentService,
    private sanitizer: DomSanitizer,
    private loaderService: Loader,
    private elRef:ElementRef) { }
  
  ngDoCheck(){
    
  }
  ngOnInit() {
    console.log(this.paymentService.paymentForm);
    this.paymentService.paymentForm ? this.form = this.sanitizer.bypassSecurityTrustHtml(this.paymentService.paymentForm) : null
    this.loader = true;
  }

  ngAfterViewInit() {
    let test;
    if(this.form){ 
      test = this.elRef.nativeElement.querySelector('form')
      console.log(test)
      test.submit();
    }
    
  }

}

Answer 1

您不应该使用submit() 方法来避免页面刷新时重定向。

http服务用于从表单提交序列化为json的表单数据。如果您将表单元素绑定到模型，那么将模型发送回后端会更容易。