Add Barcode In Angular

• Here, we will learn how to add barcode in our angular project.for this at first we need to install ngx-barcode in our project using following command

npm i ngx-barcode

• Add below lines in app.component.ts

import {NgModule} from '@angular/core'; 
import {BrowserModule} from '@angular/platform-browser'; 
import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; 
import { NgxBarcodeModule } from 'ngx-barcode';

 @NgModule({ declarations: [AppComponent],

 imports: [ BrowserAnimationsModule, BrowserModule, NgxBarcodeModule], 
 providers: [], bootstrap: [AppComponent] })

• Add below lines in app.component.ts

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  value = '';
  displayValue = true;
  fontSize = 20;
  background = '#ffffff';

  get values(): string[] {
    return this.value.split('\n');
  }
}

• Add below lines in app.component.html

<textarea placeholder="Barcode value" [(ngModel)]="value"></textarea>
<ngx-barcode *ngFor="let bcValue of values" [bc-value]="bcValue"></ngx-barcode>

•  Run our application