Javascript 如何在爱奥尼亚3中使用cordova插件蓝牙？

其他信息：

我知道访问cordova插件的常见方法：

(<any>window).plugins.myPlugin 

or

declare var yourGloballyAccessablePlugin: any;

然后我尝试访问插件（在我的手机上测试），如下所示：

import { bluetoothle } from 'cordova-plugin-bluetoothle';

...

(<any>window).bluetoothle

@组件、类开始和属性

  constructor(private translate: TranslateService, platform: Platform, settings: Settings, private config: Config, private statusBar: StatusBar, private splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      console.log("I'm ready");
      // your bluetothle methods can be accessed after
      //cordova.plugins.bluetoothle
      // for brevity i added a sample method from repo , it can be changed
      //based on your need
      let initializeResult: object;
      let params: object = {
        "request": true,
        "statusReceiver": false,
        "restoreKey": "bluetoothleplugin"
      };
      cordova.plugins.bluetoothle.initialize(initializeResult, params);

      console.log(JSON.stringify(initializeResult));

      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
    this.initTranslate();
  }

但这样应用程序甚至不加载，它只是超时并输出到服务器的连接不成功，当我运行应用程序时，没有它工作的插件代码

更新2:

我用chrome调试了这个应用程序（之前的错误是由--livereload选项引起的，原因不详） 这就是我得到的错误：

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'initialize' of undefined
TypeError: Cannot read property 'initialize' of undefined

检查

cordova

、

cordova.plugins

和

cordova.plugins.bluetoothle的类型
与：

我得到以下结果：

object
object
undefined

步骤1：
我们必须导入这个插件

ionic cordova plugin add cordova-plugin-bluetooth-serial
npm install --save @ionic-native/bluetooth-serial

步骤2：
在提供商app.module.ts页面中添加BluetoothSerial
步骤3：
启用蓝牙
您的手机蓝牙会自动打开或请求您的许可

      unpairedDevices: any;
      pairedDevices: any;
      gettingDevices: Boolean;
    constructor(private bluetoothSerial: BluetoothSerial,
     private alertCtrl: AlertController) {
    bluetoothSerial.enable();
  }

步骤4：开始扫描

    startScanning() {
    this.pairedDevices = null;
    this.unpairedDevices = null;
    this.gettingDevices = true;
    this.bluetoothSerial.discoverUnpaired().then((success) => {
      this.unpairedDevices = success;
      console.log(success, "hai")
      this.gettingDevices = false;
      success.forEach(element => {
        // alert(element.name);
      });
    },
      (err) => {
        console.log(err);
      })

    this.bluetoothSerial.list().then((success) => {
      this.pairedDevices = success;
    },
      (err) => {

      })
  }
  success = (data) => alert(data);
  fail = (error) => alert(error);

步骤5：检测可用的蓝牙设备后，选择以下任意一项
那些

步骤6：断开设备

isconnect() {
let alert = this.alertCtrl.create({
  title: 'Disconnect?',
  message: 'Do you want to Disconnect?',
  buttons: [
    {
      text: 'Cancel',
      role: 'cancel',
      handler: () => {
        console.log('Cancel clicked');
      }
    },
    {
      text: 'Disconnect',
      handler: () => {
        this.bluetoothSerial.disconnect();
      }
    }
  ]
});
alert.present();

}

步骤7：home.html页面

    <ion-content padding>

 <ion-list padding>
  <button ion-button block (click)="startScanning()">scan</button>
  <ion-list-header>
    Paired Devices
  </ion-list-header>
  <ion-item *ngFor="let device of pairedDevices">
    {{device.name}}
  </ion-item>
  <button ion-button block (click)="disconnect()">Disconnect</button>
  <ion-list-header>
    availlable Devices
  </ion-list-header>
  <ion-item *ngFor='let device of unpairedDevices'>
    <span (click)="selectDevice(device.address)">
      {{device.name}}
    </span>
  </ion-item>
  <ion-spinner name="crescent" *ngIf="gettingDevices"></ion-spinner>
</ion-list>

</ion-content>


扫描
配对设备
{{device.name}
断开
可用设备
{{device.name}

注：我希望它能帮助你。
祝你今天愉快
 与正常方式一样，您可以使用以下设备安装：

ionic plugin add cordova-plugin-bluetoothle

在此之后，在您的imports语句后包括以下行：

declare var cordova:any;

并在平台准备就绪时使用它：

platform.ready().then(
    () => {
        console.log("I'm ready");
        // your bluetothle methods can be accessed after 
        //cordova.plugins.bluetoothle
        // for brevity i added a sample method from repo , it can be changed 
        //based on your need
        cordova.plugins.bluetoothle.initialize(initializeResult, params);
    }
);

在希望使用插件消除IDE错误的每个页面顶部添加以下行：

声明var bluetoothle：任何
 首先安装插件（ionic3）：

然后使用
（：

窗口对象似乎正在加载bluetoothle模块
log（窗口）我可以在那里看到它及其所有
函数。问题是如果我试图通过
“window.bluetoothle”我又犯了一个错误

以下是测试代码（仅为构造函数，因为我没有修改任何其他内容），它会提示您激活蓝牙（仅在android上支持），并在允许后激活蓝牙（代码位于扩展的ionic3 starter应用程序的
组件.app.ts
）：

构造函数（私有翻译：TranslateService，平台：平台，设置：设置，私有配置：配置，私有状态栏：状态栏，私有splashScreen：splashScreen）{
platform.ready（）。然后（（）=>{
让initializeResult:object；
让参数：对象={
“请求”：正确，
“statusReceiver”：false，
“restoreKey”：“bluetoothleplugin”
};
（窗口）.bluetoothle.initialize（初始化结果，参数）；
让使能成功：目标；
let enableError：对象；
（window）.bluetoothle.enable（enablesucture，enablererror）；
this.statusBar.styleDefault（）；
这个.splashScreen.hide（）；
});
this.initTranslate（）；
}

测试环境：

我在我的Nexus 5上的Android 7.1.1（天堂操作系统）上测试了这个插件。这里有一个插件包装器，你可以使用它：

然而，虽然这是一个使用插件的好方法，但它并没有包装所有的方法，因此不能满足我的需要。如果它有你需要的方法，那么我建议使用它

我的主要建议是使用

（窗口）.bluetoothle.{method name}

正如前一张海报所描述的。在这里描述的所有技术中，这是唯一对我有效的技术

我希望这能帮助任何人阅读这篇文章。
在花了更多时间研究这篇文章之后，我发现有4种方法可以做到这一点（改进了我之前的答案）：

如果您不需要包装每个插件方法（许多方法缺失），请在此处使用插件包装器：

使用
（。关于如何包装插件的指南如下：

4是最干净的解决方案，如果像我一样，您需要比somq在其项目中完成的方法更多的包装方法。此方法将阻止Ionic View崩溃，但结果证明插件无论如何都不受支持，因此您仍然无法在Ionic View中使用它。
为了澄清，我不一定需要移植应用程序（这是我为我的学生项目开发的）到智能手机，但因为我可以重用我的大部分代码（因为它是用angular 5编写的）这将是一个很好的扩展。有两个问题，1.ionic的初始化代码在哪里？你在哪里调用此方法？在
app.component.ts
？我使用了ionic 3的默认启动应用程序，并尝试在平台准备好后立即访问插件，例如，在构造函数中注入平台然后在构造函数中访问它，如下所示：this.platform.isReady（）.then（（params）=>{…在这里访问插件}。是的，我指的是app.component.ts组件。有人能告诉我为什么我的问题被认为没有用处或研究不足吗？不介意回答。+1更新过程尝试我认为这是一个误解，我指的是Cordova插件蓝牙，它提供了将蓝牙适配器用作中央和外部适配器的可能性外围设备。ionic native提供的蓝牙插件只支持蓝牙中心功能。看看我问题中的bluetoothle链接，它是另一个ionic native不支持的插件，不能用通常的方式在ionic native中访问cordova插件。你测试过吗？我想我ied（如我在问题下的评论所述），我会稍后测试并报告。@MADforFUNandHappy我通常运行这样的插件，它们不是ionic native，您实现的插件使用的是
MODULAR
模型，所以这是一种javascript方法，我不得不使用ionic cordova插件添加cordova插件Bluetooth，因为我使用的是ionic 3，
    <ion-content padding>

 <ion-list padding>
  <button ion-button block (click)="startScanning()">scan</button>
  <ion-list-header>
    Paired Devices
  </ion-list-header>
  <ion-item *ngFor="let device of pairedDevices">
    {{device.name}}
  </ion-item>
  <button ion-button block (click)="disconnect()">Disconnect</button>
  <ion-list-header>
    availlable Devices
  </ion-list-header>
  <ion-item *ngFor='let device of unpairedDevices'>
    <span (click)="selectDevice(device.address)">
      {{device.name}}
    </span>
  </ion-item>
  <ion-spinner name="crescent" *ngIf="gettingDevices"></ion-spinner>
</ion-list>

</ion-content>

ionic plugin add cordova-plugin-bluetoothle

declare var cordova:any;

platform.ready().then(
    () => {
        console.log("I'm ready");
        // your bluetothle methods can be accessed after 
        //cordova.plugins.bluetoothle
        // for brevity i added a sample method from repo , it can be changed 
        //based on your need
        cordova.plugins.bluetoothle.initialize(initializeResult, params);
    }
);

ionic cordova plugin add cordova-plugin-bluetoothle

  constructor(private translate: TranslateService, platform: Platform, settings: Settings, private config: Config, private statusBar: StatusBar, private splashScreen: SplashScreen) {
    platform.ready().then(() => {

      let initializeResult: object;
      let params: object = {
        "request": true,
        "statusReceiver": false,
        "restoreKey": "bluetoothleplugin"
      };

      (<any>window).bluetoothle.initialize(initializeResult, params);

      let enableSuccess: object;
      let enableError: object;

      (<any>window).bluetoothle.enable(enableSuccess, enableError);

      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });
    this.initTranslate();
  }