在一些涉及支付功能的app，一般需要綁定銀行卡，除了靠用戶手動輸入銀行卡號，用手機掃描銀行卡也是一種常用的手段，查閱了寫資料，發現ionic有CardIO插件可以實現這個功能，就興致沖沖去嘗試，結果有些失望。
下面介紹一下如何在ionic中使用CardIO實現掃描銀行卡功能
相關CardIO插件的ngCordova說明

1、在入口文件main.js 中

const app = angular.module("app", ["ionic", "ngCordova", "ngAnimate", "ngCordova.plugins.cardIO"]);app.config(function ($ionicConfigProvider, $cordovaNgCardIOProvider) {"use strict";$cordovaNgCardIOProvider.setScanerConfig( // 配置顯示的參數{"expiry": false,"cvv": false,"zip": false,"suppressManual": false,"suppressConfirm": false,"hideLogo": true});$cordovaNgCardIOProvider.setCardIOResponseFields( // 配置返回的參數["card_type","redacted_card_number","card_number","expiry_month","expiry_year","short_expiry_year","cvv","zip"]); });

2、在controller文件中使用

angular.module("app").controller("mineCtrl", ["$scope", "$cordovaNgCardIO",function ($scope $cordovaNgCardIO) {"use strict";$scope.scanBankcard = () => {$cordovaNgCardIO.scanCard().then(function (response) { // 掃描成功//Success response - it`s an object with card dataconsole.log("Success response");console.log(response);},function (response) { // 取消掃描//We will go there only when user cancel a scanning.//response always nullconsole.log("when cancel scanning");console.log(response);});}; }]);

3、在html中

<ion-view view-title="掃描銀行卡"><ion-content><i ng-click="scanBankcard ()" class="icon ion-camera"></i></ion-content> </ion-view>

嘗試了以后效果不是很理想，CardIO插件只能掃描16位以下，并且是浮雕數字的銀行卡，無法滿足設計需求，只能暫時放棄。如有大家有什么解決辦法，歡迎交流

參考文章：
ionic使用cardio報錯

總結

以上是生活随笔為你收集整理的ionic使用CardIO实现扫描银行卡功能（只能扫描16位以下，并且是浮雕数字）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。