Search code examples
androidcordovaionic-frameworkprintingionic-native

@ionic-native/printer is not working


I have used @ionic-native/printer plugin to implement printing option for bill report.

I have installed plugin using this command line:

    npm install --save @ionic-native/printer

Then in the viewbill.html I put a line to active the printer :

    <button ion-button (click)="print()">
    <ion-icon name="print">
      </ion-icon>
      Print
    </button>

Then my viewbill.ts code:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, Platform, AlertController } from 'ionic-angular';
import { Printer, PrintOptions } from '@ionic-native/printer';

@IonicPage()
@Component({
  selector: 'page-viewbill',
  templateUrl: 'viewbill.html',
})
export class ViewbillPage {

  public srNo = [];
  public particulars = [];
  public particularAmt = [];
  constructor(public navCtrl: NavController,
              public navParams: NavParams,
              public printer: Printer,
              public platform: Platform,
              public alertCtrl: AlertController) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad ViewbillPage');
    this.srNo = [
      {no: '1'},
      {no: '2'},
      {no: '3'}
    ];

    this.particulars = [
      {particular: 'Particular 1'},
      {particular: 'Particular 2'},
      {particular: 'Particular 3'}
    ];

    this.particularAmt = [
      {amount: '100'},
      {amount: '500'},
      {amount: '1000'}
    ];
  }

  print(){
    if(this.platform.is('cordova')){
      if(this.printer.isAvailable())
      {
        let options: PrintOptions = {
          name: 'Bill Report',
          duplex: true,
          landscape: true,
          grayscale: true
        };
        var page = document.getElementById('billReport');
        this.printer.print(page, options);
      }
      else{
        this.alert('Please connect your device to a printer!');
      }
    }
    else{
      this.alert('You are on a web browser!');
    }
  }

  alert(message: string) {
    this.alertCtrl.create({
      title: 'Info!',
      subTitle: message,
      buttons: ['OK']
    }).present();
  }
}

Whenever I click on a print button, nothing happens!

Did anyone have this kind of troubles with the plugin ? Did I do something wrong ? Should I install other things to fix the problem ? And did anyone have a exemple project working well ?

Thank you very much !


Solution

  • You seem to have missed the step of installing the codrova plugin:

    ionic cordova plugin add de.appplant.cordova.plugin.printer
    

    The ionic native package is a wrapper for the above plugin. Check docs here