电子+；Angular7如何在组件中使用serialport.list（）

多亏了stackoverflow上的另一位成员，我才能够在一个Electron应用程序中使用SerialPort。现在谈下一个问题

我在Angular中有一个组件，我希望有一个下拉列表来选择要连接的serialport。但是我想弄清楚serialport.list（）是如何工作的

应用程序组件.ts

import { Component, OnInit } from '@angular/core';
import { } from 'electron';
import * as Serialport from 'serialport';
import { SerialService } from './serial.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

  title = 'electron-angular-serialport';
  comPorts = [];

  constructor(private serial: SerialService) {
    let isElectron: boolean = window && window['process'] && window['process'].type;

    if (isElectron) {
      let serialport: typeof Serialport = window['require']('serialport');
      let app: Electron.App = window['require']('electron').remote;
      console.log(serialport, app, window['process']);
    }
  }

  ngOnInit() {
    this.getPorts();
    console.log(this.comPorts);
  }

  // getPorts() {
  //   this.serial.serialPort.list(function (err, ports) {
  //     ports.forEach(function(port) {
  //       this.comPorts.push(port);
  //     });
  //   });
  // }

  getPorts() {
    this.comPorts = this.serial.serialPort.list();
  }
}

结果

如果查看注释后的代码块，您会注意到我试图将每个端口推入组件。但这会给出一个错误，指出comPorts是未定义的。这很奇怪，因为我假设范围在这里没有丢失

我想特别抓取这两个端口，然后将它们推到我的组件中，这样我就可以下拉列表，用户就可以选择Arduino连接

干杯，试试：

getPorts() {
     this.serial.serialPort.list((err, ports) => {
       ports.forEach(port => {
         this.comPorts.push(port);
       });
     });
   }

---

是的，这很有效！如果在应用程序运行期间插入USB，可以使用什么方法自动更新端口列表？我必须关闭应用程序并重新打开它（当前更新）。@Clayton Allen我真的不知道您对串行端口做了什么：）），您的问题是使用函数与箭头函数，当您在回调中使用函数时，它不会传递全局

此

，因此它在函数中未定义，我们使用箭头函数传递

并使用它。Fazil感谢您的帮助。我认为我关于自动更新serialport列表的问题更适合其他地方的问题。@ClaytonAllen不客气，是的，你可以在另一篇新帖子中提问。