AngularJS與科爾多瓦/ PhoneGap無法工作的移動Backbutton

我正在爲Cordova/PhoneGap開發Android的第一款AngularJS移動應用程序。我在腳本文件中添加了下面的代碼，但是我無法捕獲backbutton事件。以下是我在我的scripts.js中：AngularJS與科爾多瓦/ PhoneGap無法工作的移動Backbutton

var app = angular.module('QFA', []); 

    app.controller('QFAinit', function($scope, $window) { 

      document.addEventListener("deviceready", onDeviceReady(), false); 

      function onDeviceReady() { 

      $window.alert("Device Ready-1"); 
      document.addEventListener("backbutton", onBackKeyDown, false); 
      $window.alert("Device Ready-2"); 

      function onBackKeyDown() { 
       $window.alert("Inside onBackKeyDown1"); 
      } 
     } 
    });

我打電話來此如下：

<body ng-controller="QFAinit">

當我運行的應用程序我得到「設備就緒-1」和「設備Ready-2「警報。這意味着設備準備好的事件正在被正確觸發，並且還嘗試了按鈕。但是，當我按下後退按鈕時，沒有任何事情發生，而是執行默認行爲，即App退出。

另一方面，如果我用eventlistener命令上的onBackKeyDown（）替換onBackKeyDown，那麼當應用程序被加載時，緊接在上述兩個警報之後，我會得到「Inside onBackKeyDown1」警報。但是一旦應用程序被加載，那麼後退功能就不存在了。

有人可以請建議如何使其工作。

非常感謝！

===============更新=================

我已經意識到我需要包括科爾多瓦.js陷阱後臺！一旦我補充說明，後退按鈕確實被困住了。然而，由於該結果我得到一個破碎的應用程序，如下圖所示：

我自己也嘗試從2.1改變的jQuery版本1.11，1.10和1.4.5但沒有任何影響。事實上，即使我刪除了JQuery，我仍然得到了破壞的界面。

來源

2015-02-10 Anjum

方括號是否始終顯示或僅當您按下後退按鈕時？在你的控制檯中有錯誤，我建議你將安裝Eclipse從logcat讀取，這樣你就可以知道你的應用程序出了什麼問題。 – Ricconnect 2015-02-11 07:37:03

他們總是顯示，如果我添加cordova.js。當cordova.js被移除時，它們會消失。 Eclipse .....另一個學習練習:-( – Anjum 2015-02-11 07:41:45

如果我正確提醒，移動設備上的警報框是異步的。該應用程序可能沒有時間顯示警報框，因爲它已關閉。如果你做了console.log你可以在Eclipse logcat中閱讀它嗎？或者，如果你做了防止默認應該阻止關閉應用程序：

function onBackKeyDown(event) { 
    event.preventDefault(); 
    $window.alert("Inside onBackKeyDown1"); 
}

來源

2015-02-10 13:20:57 Ricconnect

警報必須停止正在運行的所有內容，它曾經與使用PhoneGap + JQueryMobile構建的應用程序的先前版本一起工作，我正在使用AngularJS重新開發相同的應用程序， PhoneGap和它的不工作在這裏我認爲preventDefault不再需要與最新的科爾多瓦。但我也試過，也沒有任何成功對不起，我沒有使用Eclipse和工作在命令行。以及Ripple Emulator。 – Anjum 2015-02-10 13:30:21

請參閱上面的更新。Thx @Ricconnect – Anjum 2015-02-11 06:16:03

以下是終於爲我工作，把所有這一部分。儘管它也適用於Body。不是控制器了。

<link rel="stylesheet" href="js/bootstrap.min.css"> 
    <link rel="stylesheet" href="js/bootstrap-theme.min.css"> 

    <script src="js/jquery-1.11.2.min.js"></script> 
    <script src="cordova.js"></script>   

    <script> 
    document.addEventListener("deviceready", onDeviceReady(), false); 

    function onDeviceReady() { 

     document.addEventListener("backbutton", onBackKeyDown, true); 

    } 

    function onBackKeyDown() { 
     alert('Back Button Pressed'); 
     resp = confirm("If you use Home key to exit, the App will remain active. Still want to Quit?"); 
     if (resp === true) { 
      navigator.app.exitApp(); 
     } 
    } 
    </script> 

    <script src="js/angular.min.js"></script> 
    <script src="js/angular-resource.min.js"></script> 
    <script src="js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="app.js"></script>

來源

2015-02-11 08:51:31 Anjum

AngularJS與科爾多瓦/ PhoneGap無法工作的移動Backbutton

回答

相關問題