2016-08-11 11 views
1

これは、イオン/角型ハイブリッドアプリ向けです。私はcordova-plugin-shakeを使ってshake eventを発射しようとしています。ランダムなイメージをリロードすることになっています。これまでのところランダムな画像が表示されていましたが、シミュレータのshake eventをテストすると機能しません。イオン/角型ハイブリッドアプリ、振動イベントが発生する問題

エラーが発生しましたReferenceError: shake is not definedしかし、ドキュメントにはYou do not need to reference any JavaScript, the Cordova plugin architecture will add a shake object to your root automatically when you build.と表示されます。私はここで何が欠けていますか?これをどのように機能させることができますか?私はcordova ver 6.3.0を使用しています。

はここapp.js

angular.module('TarotApp', ['ionic','ngAnimate']) 

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

     // Don't remove this line unless you know what you are doing. It stops the viewport 
     // from snapping when text inputs are focused. Ionic handles this internally for 
     // a much nicer keyboard experience. 
     cordova.plugins.Keyboard.disableScroll(true); 
    } 
    if(window.StatusBar) { 
     StatusBar.styleDefault(); 
    } 
    shake.startWatch(onShake, 40); 
    }); 
}) 

angular.module('TarotApp') 
    .controller('TarotCtrl', function ($scope) { 

     $scope.tarotImg = ['1', '2', '3', '4', '5', '6']; 

     $scope.randTarotImg = $scope.tarotImg[Math.floor(Math.random() * $scope.tarotImg.length)]; 


}); 

var onShake = function() { 
    $scope.randTarotImg = $scope.tarotImg[Math.floor(Math.random() * $scope.tarotImg.length)]; 
}; 

だここであなたが構築し、実際の携帯電話に展開するときに、振れオブジェクトにのみ追加されるのindex.html

<!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/angular-animate/angular-animate.min.js"></script> 

    <!-- cordova script (this will be a 404 during development) --> 
    <script src="cordova.js"></script> 

    <!-- your app's js --> 
    <script src="js/app.js"></script> 
    </head> 
    <body ng-app="TarotApp"> 

    <ion-pane> 

    <!-- <ion-header-bar class="bar-stable"> 

     </ion-header-bar>--> 

     <ion-content ng-controller="TarotCtrl"> 


      <img ng-src="img/{{randTarotImg}}.jpg" class="tarot"/> 


     </ion-content> 

    </ion-pane> 



    </body> 
</html> 
+0

コントローラ内でこの機能を実装しようとしましたか? – Anokrize

+0

@Anokrizeありがとうございます。私はそれを試して、働いていない。まだ 'シェイクが定義されていません 'というエラーが表示され、シミュレータで「シェイク」をテストするときにランダムな画像が表示されません。 –

+0

プラグインを追加しましたか? 'cordova plugin add cordova-plugin-shake'もしそうなら、あなたはプラットフォームを削除してみることができます。 – e666

答えて

2

です。あなたがブラウザでテストしている場合はありません。これを追加すると、テスト中にエラーを回避できます。

if(window.shake) shake.startWatch(onShake,40); 
+0

ああ、私はそれをテストした –

+0

私はアンドロイド携帯電話、サムスンギャラクシーS5を使用していました –

関連する問題