Ionic Qr Code Generator - 如何使用固定值？

Question

下午好，

我正在尝试创建一张显示固定值 QR 码的卡片。我找到的插件从一个输入和一个按钮获取值，有什么方法可以更改 js 以从固定值获取输入？

home.page.html

<ion-card-content>
<div class="ion-padding">
    <ion-input type="text" placeholder="My QR data" [(ngModel)]="qrData">
    </ion-input>


    <button ion-button full icon-left (click)="createCode()">
        <ion-icon name="barcode"></ion-icon>Create
    </button>

    <ion-card>
      <div align='center'>
        <ngx-qrcode [qrc-value]="createdCode">
        </ngx-qrcode>
      </div>
        <ion-card-content>
            <div align='center'> ID: {{ createdCode }} </div>
        </ion-card-content>
    </ion-card>

home.page.ts

    import { Component } from '@angular/core';
import { BarcodeScanner } from '@ionic-native/barcode-scanner/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  qrData = null;
  createdCode = null;
  scannedCode = null;

  constructor(private barcodeScanner: BarcodeScanner) {}

  createCode () {
    this.createdCode = this.qrData;
    console.log(this.createdCode);
  }

}

在此先感谢您的帮助！

Answer 1

离子部分和二维码部分无关。删除输入和按钮并简单地将常量字符串绑定到 [qrc-value]。注意 [qrc-value]="'fixed value'" 中双引号内的单引号。它表示使用文字字符串 'fixed value'

<ion-card-content>
<div class="ion-padding">
    <ion-card>
      <div align='center'>
        <ngx-qrcode [qrc-value]="'fixed value'">
        </ngx-qrcode>
      </div>
        <ion-card-content>
            <div align='center'> ID: fixed value </div>
        </ion-card-content>
    </ion-card>

工作示例：Stackblitz

Ionic Qr Code Generator - 如何使用固定值？

Ionic Qr Code Generator - How to use fixed value?

qr-code

ionic-framework

angular