Angular:QRcode
Générer des QRcode à l'aide librarie angularx-qrcode
Installer QrCode librarie
app.component.html
<div class="card text-center ">
<div class="card-header bg-info">
QRcode example
</div>
<div class="card-body">
<h5 class="card-title">{{chainetoQR}}</h5>
<p class="card-text"><qrcode [qrdata]="chainetoQR" [width]="500" [errorCorrectionLevel]="'M'"></qrcode>
</p>
</div>
<div class="card-footer text-muted">
<input type="text" class="form-control" [(ngModel)]="chainetoQR">
</div>
</div>
app.component.ts
import { Component } from '@angular/core';
import { ChartOptions, ChartType, ChartDataSets } from 'chart.js';
import { Label } from 'ng2-charts';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
public chainetoQR: string = "Hello";
}
app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
//importer le module QRCodeModule contenant les fonctionnalités de angularx-qrcode
import { QRCodeModule } from 'angularx-qrcode';
@NgModule({
declarations: [
AppComponent
],
imports: [
QRCodeModule,
BrowserModule,
AppRoutingModule,
FormsModule ,
ReactiveFormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }