Security News
New Proposed CISA Mandate Would Require Critical Infrastructure to Report Ransom Payments Within 24 Hours
CISA has proposed a set of new rules that would require critical infrastructure to report cyber incidents and ransom payments.
ng-qrcode
Advanced tools
Simple AOT compatible QR code generator for your Angular project.
Weekly downloads
Readme
Easy to use QR code generator for Angular projects.
Features:
Add as a dependency to your angular application:
npm install ng-qrcode --save
Import into your consuming module (Eg: AppModule):
import { QrCodeModule } from 'ng-qrcode';
@NgModule({
imports: [
QrCodeModule
]
})
<qr-code value="Yo world!" size="300" errorCorrectionLevel="M"></qr-code>
The value to encode in the QR code, eg: a url
An optional size in pixels to render at
Default: automatic size based on the value provided (recommended)
An RGBA Hex string to use as the color for the dark / filled modules. If an invalid value is passed, the default will be used.
Default black ("#000000FF")
An RGBA Hex string to use as the color for the empty space. If an invalid value is passed, the default will be used.
Default white ("#FFFFFFFF")
Controls the amount of redundant information included to make the QR code more likely to scan correctly if it is dirty / damaged
Default: "M"
Valid values: "L", "M", "Q", "H" - where "L" is the lowest amount of redundancy, and "H" is the highest
See: https://www.npmjs.com/package/qrcode#error-correction-level for further details
A URI suitable to use an a Image src property to load and render in the center of the QR code.
Note: the image will obscure part of the QR code, and therefore you should err on the side of a higher error correction level, anecdotally when the size is less than 1/4 of the size of the code, with at least "M" error correction, it is generally still scannable.
An optional size in pixels to render the center image.
Default: 60
An optional amount of margin to be rendered within the canvas element. Defaults to 4, where the unit is the size of one "dot" in the QR code.
If the provided component is not flexible enough for you, there is also a directive provided that is used by the component under the hood, which provides finer grain control.
A demo app is included in the repository under projects/ng-qrcode-demo
which can be
run locally using ng build && ng serve
See table below for a history of versions and their Angular compatibility.
From version 16 onwards the library major version will match the Angular major version.
Angular Version | ng-qrcode Versions |
---|---|
^17 | ^17 |
^16 | ^16 |
^15 | ^8 |
^14 | ^7 |
^13 | ^6 |
^12 | ^5 |
^10 / ^11 | ^4 |
^7 / ^8 | ^3 |
^7 | ^2 |
Essentially in some cases Angular will bundle a version of the buffer library that is not compatible with web browsers if the 'global' object is not defined.
This can be easily worked around, see comment here for options: https://github.com/mnahkies/ng-qrcode/issues/2#issuecomment-563414305
Pre-version 2.0.0 this package was developed by emin93 and used the qrious
npm package to generate the QR Codes.
The source for this was lost, and this repository is a re-write, first released
as v2.0.0 that uses the qrcode
npm package to generate QR Codes.
v2.0.0 should be backwards compatible, aside from a rename of the exported NgModule from QRCodeModule -> QrCodeModule for consistency.
FAQs
Simple AOT compatible QR code generator for your Angular project.
The npm package ng-qrcode receives a total of 9,112 weekly downloads. As such, ng-qrcode popularity was classified as popular.
We found that ng-qrcode demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
CISA has proposed a set of new rules that would require critical infrastructure to report cyber incidents and ransom payments.
Security News
Redis is no longer OSS, breaking its explicit commitment to remain under the BSD 3-Clause License forever. This has angered contributors who are now working to fork the software.
Product
Socket AI now enables 'AI detected potential malware' alerts by default, ensuring users benefit from AI-powered state-of-the-art malware detection without needing to opt-in.