大家有用過tap pay 這套金流嗎？

General
1

目前朋友介紹使用這家金流，但線上教學沒有Angular的範例，不知要如何才能讓angular 6 使用 它的SDK.
提出討論討論。謝謝🙏

2

沒人回答那我就回答一下好了

  • 可能沒人用過這間的三方金流
  • 他的範例裡面有 Direct Pay - iframe 的版本，也有範例html，裡面應該是他完整的 code
  • 理論上他的範例是 Javascript 寫出來的，你可以直接寫在 Angular 裡面我想不會有問題

看看你要不要先試試看，如果遇到問題再上來補充一下你遇到的問題 !?

3

HI RayanTseng
謝謝您的回覆喔～
我想諮詢一下按照範例引用JS檔案
`

script src=“https://js.tappaysdk.com/tpdirect/v4”>

`
這段再angular 的 index.html 裡引入

在需要使用的Component 裡寫他的Javascript

ＥＸ：

TPDirect.setupSDK(11327, ‘app_CCHADSCNHLSDLFOCMLKSJK’, ‘sandbox’)
TPDirect.card.setup(’#cardview-container’);

像這邊的TPDirect就會報錯說明沒有這個變數, 要怎麼引入檔案才可以使用引入的JS擋裡面的變數或function呢？？？

還是有什麼方法可以把JS檔案編譯成TypeScript 然後用Service注入後使用呢？

非常感謝您的回覆喔～謝謝你

4

Hi Leo

我想你載入 script 的方式沒問題，有問題的只是 TPDirect 會冒出錯誤說沒有這個變數，那是因為對於 Typescript 來說，他沒有定義擋，不知道這個變數是什麼，所以你可以使用下面的方式來做。

import {Component, OnInit} from '@angular/core';

// add this line
declare var TPDirect: any;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  // ignore ...
}

順利的話你的 div 會出現你預期的東西

其次是關於觀念上的問題，也就是您提到的這個

因為 Typescript 本身就是 Javascript 的 superset，如下圖所示

image

所以在 Typescript 裡面本來就可以寫 Javascript 的語法而不用經過任何轉換

希望您的金流介接能夠順利！

2個讚
5

謝謝您的回覆我測試是可以運行的！！
非常感謝你。
:grinning::grinning::grinning: