УГЛОВОЙ СКАНЕР

Может ли кто-нибудь помочь мне с моим проектом? У меня есть сканер, который находится здесь. Когда я сканирую в angular, Schoolid отображается неправильно, но в блокноте все правильно. const scannedData = 'StudentNumber:124452'; это мой пример. Спасибо. У моего Schoolid есть qrcode... Извините, если выложу весь код, он не знает, что делать и как это исправить

import { Component, Inject, Input } from '@angular/core';
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
import { LockerApiService } from 'src/app/locker-services/locker-api.service';

@Component({
  selector: 'app-locker-popup-details',
  templateUrl: './locker-popup-details.component.html',
  styleUrls: ['./locker-popup-details.component.scss']
})
export class LockerPopupDetailsComponent {
  lockerInfo: any;

  constructor(
    @Inject(MAT_DIALOG_DATA) public data: any,
    private lockerApiService: LockerApiService
  ) {
    this.lockerInfo = data.locker; // Update to use lockerInfo instead of locker
  }

  scanQRCode(): void {
    this.lockerApiService.scanQRCode(this.lockerInfo.Id, 'StudentNumber:123456').subscribe((response: any) => {
      console.info('Scanned QR code for locker:', this.lockerInfo.Id);
      this.lockerInfo.status = 'Occupied';
      this.lockerInfo.studentNumber = response.studentNumber;

}, (error: any) => {
      console.error('Error scanning QR code:', error);
    });
  }
}


<div class = "record">
  <h2 mat-dialog-title>LOCKER INFORMATION</h2>
  <table class = "table">
    <tr>
      <th>Locker Number</th>
      <td>{{ lockerInfo.lockerNumber }}</td>
    </tr>
    <tr>
      <th>Name</th>
      <td>{{ lockerInfo.name }}</td>
    </tr>
    <tr>
      <th>Student Number</th>
      <td>{{ lockerInfo.studentNumber }}</td>
    </tr>
    <tr>
      <th>College Program</th>
      <td>{{ lockerInfo.collegeProgram }}</td>
    </tr>
    <!-- <tr> 
      <th>Year</th>
      <td>{{ lockerInfo.year }}</td>
    </tr> -->
    <tr>
      <th>Gender</th>
      <td>{{ lockerInfo.gender }}</td>
    </tr>
    <tr>
      <th>Status</th>
      <td>{{ lockerInfo.status }}</td>
    </tr>
  </table>
  <button (click) = "scanQRCode()">Scan ID QR Code </button>

</div>


  scanQRCode(lockerNumber: number, scannedData: string): Observable<any> {
    console.info('Scanning QR code for locker:', lockerNumber);
    return this.http.post(`${this.apiUrl}/api/locker/${lockerNumber}/scan`, { scannedData });
  }

Я пытаюсь установить библиотеки qrscanner, но это не работает