angular using the script tag from the backend in html

ı use paymant system for my website. This payment system has its own payment form. In order to use this form, first a request must be made, then we need to use the script returned from here to display the form in html. I have the script(checkoutFormContent parameter) returned from the request, but I could not create this form. this is their developer page : iyzicoDeveloperPage

description on developer page to create a form:

The checkoutFormContent parameter found inside the returned result contains the HTML code that is required to generate the iyzico payment form. Right on the page where you engrave the checkoutFormContent parameter, the payment form will appear in the place where you add the “div” line.

how can i display the form in html ?

html :

<div class="row" >
<button (click)="pay2()"  class="btn btn-dark">Accept Paymant</button>
/div>
<div id="iyzipay-checkout-form" class="responsive"></div>

pay2 :

 async pay2(){
    const respRef = await this.fnc.httpsCallable('test')({email:"blabla@gmail.com",name:"bla",surname:"alb"})
    await respRef.forEach(result=>{this.sc = result.checkoutFormContent,console.log(result.checkoutFormContent)}).then(()=>{
      this.cdf.detectChanges()
    })
  }

console.log(result.checkoutFormContent) :

<script type="text/javascript">if (typeof iyziInit == 'undefined') {var iyziInit = {currency:"TRY",token:"3fa07a6c-d4eb-4790-9bbb-938ee45819ae",price:1.20,locale:"tr",baseUrl:"https://sandbox-api.iyzipay.com", merchantGatewayBaseUrl:"https://sandbox-merchantgw.iyzipay.com", registerCardEnabled:true,bkmEnabled:true,bankTransferEnabled:false,bankTransferRedirectUrl:"https://www.merchant.com/callback",bankTransferCustomUIProps:{},campaignEnabled:false,campaignMarketingUiDisplay:null,paymentSourceName:"",plusInstallmentResponseList:[{"campaignId":4,"startDate":1632603600000,"endDate":1667163599000,"campaignType":"INSTALLMENT","plusInstallment":"3","cardBankDtoList":[{"cardBankId":10,"cardBankName":"Ziraat Bankası"}]}],payWithIyzicoSingleTab:false,payWithIyzicoOneTab:false,creditCardEnabled:true,bankTransferAccounts:[],userCards:[],fundEnabled:true,memberCheckoutOtpData:{},force3Ds:false,isSandbox:true,storeNewCardEnabled:true,paymentWithNewCardEnabled:true,enabledApmTypes:["SOFORT","IDEAL","QIWI","GIROPAY"],payWithIyzicoUsed:false,payWithIyzicoEnabled:true,payWithIyzicoCustomUI:{},buyerName:"John",buyerSurname:"Doe",merchantInfo:"",cancelUrl:"",buyerProtectionEnabled:false,hide3DS:false,gsmNumber:"",email:"email@email.com",checkConsumerDetail:{},subscriptionPaymentEnabled:false,ucsEnabled:false,fingerprintEnabled:false,payWithIyzicoFirstTab:false,creditEnabled:false,metadata : {},createTag:function(){var iyziJSTag = document.createElement('script');iyziJSTag.setAttribute('src','https://sandbox-static.iyzipay.com/checkoutform/v2/bundle.js?v=1662060920291');document.head.appendChild(iyziJSTag);}};iyziInit.createTag();}</script>

angular using the script tag from the backend in html

0 Answers