Ionic 2 Card IO 插件 - Scan()答案

【问题标题】：Ionic 2 Card IO plugin - Scan()Ionic 2 Card IO 插件 - Scan()
【发布时间】：2017-05-18 00:18:51
【问题描述】：

总结

我在 Ionic 2 项目中使用 Card IO Cordova 插件。它可以正确扫描并允许手动输入。当我输入我的信息时，我将扫描/手动条目中的值设置为出现在我的模板中的数据绑定值。持卡人姓名、已编辑的卡号和 cvv 都绑定回我的模板，我在该模板中显示卡详细信息以供确认。但是，到期日期、到期年份和邮政编码似乎不具有约束力。

例如：

---template---
-not working
<ion-input type="text" [(ngModel)]="postalCode"></ion-input> 

-working
<ion-input type="text" [(ngModel)]="redactedCardNumber"></ion-input> 

---component controller---
goCardIO() {
    console.log("hello")
    this.platform.ready().then(() => {
      CardIO.canScan().then((res: boolean) => {
        if (res) {
          let options = {
            requireCardholderName: true,
            requireExpiry: true,
            requireCCV: true,
            requirePostalCode: true,
            scanInstructions: "Scan the front of your card",
            scanExpiry: true,
            scanCardHolderName: true,
            guideColor: '#12be76',
            hideCardIOLogo: true
          };
          CardIO.scan(options).then((data) => {
            this.setCardData(data);
            console.log("CONSOLEEEE   >>>>>> " + data.postalCode)
          }, err => {
            console.log(err);
            // An error occurred
          });
        }

      });
    });

  }

  setCardData(data: any) {
    this.cardObj = data;
    this.cardHolderName = data.cardholderName;
    this.cvv = data.cvv;
    this.redactedCardNumber = data.redactedCardNumber;
    this.cardNumber = data.cardNumber;

    // Nothing happening here apparently?
    this.expiryMonth =  data.expiryMonth;
    this.expiryYear = data.expiryYear;
    this.postalCode = data.postalCode;
  }

结论：

我调用 goCardIO()。它打开扫描仪。它扫描卡。我输入额外的必需信息。我接着打。然后我将 setCardData() 中的“数据”设置为绑定到模板的值。我只是不明白为什么 postalCode 不起作用，但 redactedCardNumber 起作用。另外，我只能在设备中测试这个插件，而且我似乎无法让任何控制台日志出现在 xCode 中。

我的猜测

有一瞬间，我以为我的 ios 版本没有更新。但后来我在模板中使用了一些标签，它们更新了。所以不应该这样。但是，我的控制台日志出现在其他地方，但我放在 goCardIO() 中的新日志没有打印。

我只是访问了错误的字段“数据”对象吗？

【问题讨论】：

标签： ios cordova angular data-binding ionic2

【解决方案1】：

我明白了。扫描后你会得到这个数据：

{"cardType":"MasterCard","redactedCardNumber":"•••• •••• •••• 1111","cardNumber":"4111111111111111","expiryMonth":2,"expiryYear":2021,"postalCode":"1233","cardholderName":"javier"}

但您不会获得 CVV。出于证券原因，您必须编写 Cvv

这是我的选择：

let options = {
        requireCardholderName: true,
        requireExpiry: true,
        requireCCV: true,
        requirePostalCode: true,
        scanInstructions: "Escanee la parte frontal de su Tarjeta",
        scanExpiry: true,
        scanCardHolderName: true,
        keepApplicationTheme:true,
        guideColor: '#12be76',
        hideCardIOLogo: true,
        useCardIOLogo:false,
    };

【讨论】：