Generate QR code with Share / Download Feature ( Angular 8)

Hey there,

Recently I had to generate QR code in my web application for a client. So I thought to share it here.

Library Used

Angular Material
ngx-qrcode2

npm install ngx-qrcode2 --save 

Now, the package will be installed in our application.

Go to the app.module.ts file add a reference there for the QR code package.

import { BrowserModule } from '@angular/platform-browser';    
import { NgModule } from '@angular/core';    
import { AppRoutingModule } from './app-routing.module';    
import { AppComponent } from './app.component';    
import { NgxQRCodeModule } from 'ngx-qrcode2';    
import { FormsModule }    from '@angular/forms';    

@NgModule({    
  declarations: [    
    AppComponent    
  ],    
  imports: [    
    BrowserModule,    
    AppRoutingModule,    
    NgxQRCodeModule,    
    FormsModule    
  ],    
  providers: [],    
  bootstrap: [AppComponent]    
})    
export class AppModule { }    

Open the app.component.html file and add the code in it.

Open the app.component.ts file and add the code in it.

Pass the string to "value" element to generate the QR code.

Thats it for now.