Ionic ngcordova 二维码扫描

ionic 中ngcordova提供二维码扫描功能 二维码插件 http://ngcordova.com/docs/plugins/barcodeScanner
ionic corodova nodejs bower 的安装方法网上有教程，下面是各个模块的版本   

版本号

下面开启项目之旅
1、新建项目
ionic start Ionic_barcode blank
cd Ionic_barcode
ionic platform add android
2、 添加二维码扫描插件
cordova plugin add https://github.com/phonegap/phonegap-plugin-barcodescanner.git

我用的subline 整个项目的结构如下

3、添加ngcordova
3.1 下载 ng-cordova.min.js
https://github.com/driftyco/ng-cordova/releases
将ng-cordova.min.js拷贝到项目的www/js目录。
3.2 也可以用下面的方法下载
bower install ngCordova
4、index.html中引用
我用的是3.2的方法
项目结构如下：

index.html 中的引用如下

注：ngcordova.min.js 一定要在cordova.js 前面引用

5、修改app.js
angular.module(‘starter’, [‘ionic’,’ngCordova’])
6、编写controller
在www/js目录下新建controller.js
angular.module(‘starter.controllers’, [])
.controller(‘barcodeCtrl’, function ($scope,$cordovaBarcodeScanner) {
$scope.scanBarcode = function() {$cordovaBarcodeScanner.scan().then(function(imageData) {
alert(imageData.text);
console.log(“Barcode Format -> ” + imageData.format);
console.log(“Cancelled -> ” + imageData.cancelled);
}, function(error) {
console.log(“An error happened -> ” + error);
});
};
});
记得在app.js 注入controller 模块
angular.module(‘starter’, [‘ionic’,’ngCordova’,’starter.controllers’])

7、方法的调用
在index.html中

<ion-pane>
  <ion-header-bar class="bar-stable">
    <h1 class="title">二维码扫描示例</h1>
  </ion-header-bar>
 <ion-content ng-controller="BarcodeScannerCtrl"  scroll="false" padding="true">
<button ng-click="scan()" class="button button-block button-positive">Scan</button>

<div class="card">
  <div class="item item-divider">Barcode Results</div>
  <div class="item">二维码信息: {{scanResult.text}}</div>
  <div class="item">编码格式: {{scanResult.format}}</div>
  <div class="item">Cancelled: {{scanResult.cancelled}}</div>
</div>

</ion-pane>

注：在index 引人controller.js

打包apk 注：下载android sdk 我的是android-sdk-23
ionic build android