Ionic Android问题:扫描功能不起作用

时间:2018-02-05 06:45:46

标签: android angularjs cordova ionic-native

我是angularjs和ionic cordova的新手。我正在关注离子cordova BLE插件模块的视频讲座中给出的代码。我正在尝试使用离子3来完成这项工作,并为BLE安装了离子cordova插件。

https://www.youtube.com/watch?v=chfXawb_eVY&t=1898s

我遵循了确切的指示。这是我的代码文件:

app.module.ts

  import { BrowserModule } from '@angular/platform-browser';
  import { ErrorHandler, NgModule } from '@angular/core';
  import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
  import { SplashScreen } from '@ionic-native/splash-screen';
  import { StatusBar } from '@ionic-native/status-bar';
  import { BLE } from '@ionic-native/ble';
  import { MyApp } from './app.component';
  import { HomePage } from '../pages/home/home';

  @NgModule({
   declarations: [
   MyApp,
   HomePage
 ],
  imports: [
   BrowserModule,
   IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
  MyApp,
  HomePage
],
 providers: [
 StatusBar,
 SplashScreen,
 {provide: ErrorHandler, useClass: IonicErrorHandler},
  BLE
    ]
   })        export class AppModule {}

home.ts

     import { Component, NgZone } from '@angular/core';
     import { NavController } from 'ionic-angular';
     import { BLE } from '@ionic-native/ble';
     import { ToastController } from 'ionic-angular';
     import { setTimeout } from 'core-js/library/web/timers';



     @Component({
     selector: 'page-home',
     templateUrl: 'home.html'
     })
     export class HomePage {

     devices: any[] = [];
     statusMessage:string;

     constructor(public navCtrl: NavController,
          public toastCtrl: ToastController,
          private ble: BLE,
          private ngZone: NgZone) {

        }

   scan(){
     this.setStatus('Scanning for bluetooth LE devices');
     this.devices = [];

     this.ble.scan([], 2).subscribe(

     device=>this.onDeviceDiscovered(device),
     error=>this.scanError(error)
     );  
     setTimeout(this.statusMessage.bind(this),5000,'Scan Complete');
   }


    onDeviceDiscovered(device){
     console.log('Scanning');
     console.log('Discovered ' + JSON.stringify(device,null,2));
     this.ngZone.run(()=>{
     this.devices.push(device);
    });
    } 

     scanError(error) {
     console.log('Check your bluetooth connection');
    }

   }

home.html的

    <ion-header>
    <ion-navbar>
      <ion-title>
         BLE Scanner
         </ion-title>
        <ion-buttons end>
        <button ion-button (click)="scan()">
                 Scan
           </button>
    </ion-buttons>
    </ion-navbar>
    </ion-header>

   <ion-content>
       <ion-list>
       <button ion-item *ngFor="let device of devices">
         <h2>{{ device.name || 'Unnamed' }}</h2>
         <p>{{ device.id }}</p>
         <p>RSSI:{{ device.rssi }}></p>
       </button>
   </ion-list>  
  </ion-content>

函数scanError没有在视频中写入,我已经写过了。

这是webview截图

enter image description here

此.setStatus函数未定义。但是,在视频中,该功能尚未声明。我试着宣布

            setStatus:any

但该功能仍然显示相同的消息。此外,即使我删除了setStatus函数,我也无法在控制台中收到任何消息。

我在开始时已经包含了NgZone组件。

有没有办法解决这个问题,或者我错过了什么?

1 个答案:

答案 0 :(得分:1)

您需要在代码中编写setStatus函数。

setStatus(message) {
  console.log(message);
  this.ngZone.run(() => {
    this.statusMessage = message;
  });
}

slides上的代码是缩写。演示文稿中示例的源代码可在github https://github.com/don/ionic-ble-examples

上找到