现今，我们可以在JavaScript中生成QR码

2 年 ago
科, 雅
1 minute

所以我试了一下。为了省力，我使用了一个叫做angular-qr的工具。

结果(演示)

    • 今回、作ったものの ⇒ http://hkusu.github.io/AngularJS_QR_demo/

英数字を入力すると、リアルタイムでQRコードが生成されます。

引入程序

前提 tí)

    • 開発環境 は Mac OS X (Mavericks) です。

 

    • AnuglarJS の環境構築は、Yeoman と generator-angular を使いました。

雛型を作るまでの手順は、前に投稿したこちらと同じ感じ。

AngularJS の Yeoman雛型に Application Cache を導入

生成AngularJS的模板之后的步骤。

Bower で angular-qr をインストール

$ bower install angular-qr –save

$ grunt bower-install とするか、もしくは index.html に下記を追記します。

app/index.html

AngularJS に組み込み

app/scripts/app.js
‘use strict’;

angular.module(‘qrTestApp’, [
‘ngCookies’,
‘ngResource’,
‘ngSanitize’,
‘ngRoute’,
+ ‘ja.qr’
])
〜

この状態で使えるようになっているはずなので、後は Controller と View を書きます。

app/scripts/controllers/main.js
‘use strict’;

angular.module(‘qrTestApp’)
.controller(‘MainCtrl’, [‘$scope’, function ($scope) {

$scope.string = ”;

}]);

app/views/main.html

QRコードのテスト

 

 

以上！

其他

    • 今回のソースはこちらに置いておきます。

https://github.com/hkusu/AngularJS_QR_demo

bannerAds