Question

我按照本教程https://blog.nraboy.com/2015/09/support-ibeacons-in-your-ionic-framework-mobile-app/在离子框架中搜索iBeacons，我没有使用estimote ibeacon，我只是使用bluethoot 4 usb stick并使用一些python进行广播脚本，Android应用程序Beacon Scaner找到了灯塔，但我的离子应用程序并不是，我在离子世界中是新手，我不知道如何调试应用程序来完成错误

这是app.js中的角度代码

angular.module('starter', ['ionic','ngCordovaBeacon'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

.controller("BeaconController", function($scope, $rootScope, $ionicPlatform, $cordovaBeacon) {

    $scope.beacons = {};
    $scope.info = []
    $scope.info.push('Controller Init');

    $ionicPlatform.ready(function() {
        $scope.info.push('Ready to use Native API');

        $rootScope.$on("$cordovaBeacon:didRangeBeaconsInRegion", function(event, pluginResult) {
            $scope.info.push('Searching for beacons');
            var uniqueBeaconKey;
            $scope.info.push('Beacons Quantity: '+ pluginResult.beacons.length);
            for(var i = 0; i < pluginResult.beacons.length; i++) {
                uniqueBeaconKey = pluginResult.beacons[i].uuid + ":" + pluginResult.beacons[i].major + ":" + pluginResult.beacons[i].minor;
                $scope.beacons[uniqueBeaconKey] = pluginResult.beacons[i];
            }
            $scope.$apply();
        });
        $cordovaBeacon.startRangingBeaconsInRegion($cordovaBeacon.createBeaconRegion("trendnet", "e20a39f4-73f5-4bc4-a12f-17d1ad07a961"));


    });
});

我用灯塔扫描仪应用程序显示的那个改变了uuid（我不知道这是否正确），添加了一些＆＃34;日志以在应用程序中显示我＆＃34;，但只是显示＆＃39;准备使用Native API＆＃39;但似乎它永远不会进入$ rootScope。$ on（＆＃34; $ cordovaBeacon：didRangeBeaconsInRegion＆＃34;，function（event，pluginResult）

我的模板代码

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ionic-platform-web-client/dist/ionic.io.bundle.min.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <!-- Cordova is bootstrapped by ionic-platform-web-client, uncomment this if you remove ionic-platform-web-client... -->
<!-- <script src="cordova.js"></script> -->

    <!-- your app's js -->
    <script src="js/ng-cordova-beacon.min.js"></script>
    <script src="js/app.js"></script>
  </head>
  <body ng-app="starter">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Beacons</h1>
      </ion-header-bar>
      <ion-content ng-controller="BeaconController">
    <div class="list">
        <div class="item" ng-repeat="informacion in info">
          {{informacion}}
        </div>
        <div class="item" ng-repeat="(key, value) in beacons">
            <div class="row">
                <div class="col truncate">
                    {{value.uuid}}
                </div>
            </div>
            <div class="row">
                <div class="col">
                    major: {{value.major}}
                </div>
                <div class="col">
                    minor: {{value.minor}}
                </div>
            </div>
            <div class="row">
                <div class="col">
                    {{value.proximity}}
                </div>
            </div>
        </div>
    </div>
</ion-content>
    </ion-pane>
  </body>
</html>

如果有一些经验丰富的离子开发者可以帮助我，我会贬低它！

离子框架和iBeacons

0 个答案: