2015-03-13 107 views
1

(由喬治·斯托克在評論中我已經編輯了這個問題,以便它現在大約是角QRCode的,而不是QRCode.js建議。)如何使用angular-qrcode Angular?

我試圖用angular-qrcode顯示的QR碼有角度的,但我無法讓它工作。我目前只是試圖將該代碼作爲the readme描述:

<qrcode data="string"></qrcode> 

Unfortunatel它不會做任何事情。我沒有得到任何錯誤,但是我也沒有看到任何qr-image。

爲了給出一個工作示例,我分叉了angular-phonecat tutorial here並嘗試在該代碼中使用angular-qrcode(commit here)。

有沒有人知道我做錯了試圖使用angular-qrcode?歡迎所有提示!

+0

幫助我們回答您的問題的一件事是您花時間編寫代碼來重現問題並將其置於您的問題中。只要發佈一個鏈接,如果該鏈接死亡或宕機,我們將無法看到您的代碼。而且,將你的代碼加入你的問題迫使你花時間減少垃圾並讓我們輕鬆跟隨。 – 2015-03-16 12:14:32

+0

@GeorgeStocker - 我編輯了我的問題,並添加了我目前正在嘗試的代碼(只有一行)。不幸的是,它不會產生所需的結果(qr代碼),但它也不會給出錯誤。它只是不顯示任何東西。這個問題是否更好? – kramer65 2015-03-16 12:38:33

+0

在控制檯中是否有任何東西出現?當你輸入'var g = new QRCode(document.getElementById(「ticket-qrcode」),「ABC」);'在控制檯中,會發生什麼?如果你然後訪問'g',它是未定義的還是存在一個實例化的對象? – 2015-03-16 12:44:40

回答

9

永遠不要訪問控制器中的DOM,請使用directives

而不是創建自己的指令,你可能想看看Angular-qrcode

如何使用這個庫的短版就是這樣的:

<qrcode data="{{url}}"></qrcode> 

爲了得到這個工作,你需要在你的HTML兩種original qr-code generator和角包裝(角QR碼)的腳本。還請記住添加'monospaced.qrcode'作爲模塊依賴項。

+0

感謝您的提示。我一直在努力實現這一點,但是當簡單地將這個''粘貼到部分(在ng-repeat內部或外部)時,我不會得到任何結果;沒有qr碼,在控制檯沒有錯誤,沒有。我想做一個jsfiddle,但我不知道如何加載angular-qrcode。你能幫我多一點,讓這個工作? – kramer65 2015-03-13 14:28:14

+0

我現在分叉角手機教程,並嘗試在那裏使用angular-qrcode(在這裏提交:https://github.com/kramer65/angular-phonecat/commit/6e686f49827c0992378d611bab68517c7bf3b6b0),但我真的無法得到它的工作。你知道我在這裏做錯了嗎? – kramer65 2015-03-16 10:46:13

+0

@ kramer65我用更多的信息更新了我的答案。我也分叉你的github回購,並使其與此承諾工作:https://github.com/aleksabl/angular-phonecat/commit/1695e5e073e286eb044f4dd3acc83bb03fe5d629 – 2015-03-16 19:19:53