0

当我尝试运行一个空白应用程序时,控制台输出是:“调用 js 触发 nativeReady 事件时出错。您是否在 html 脚本标签中包含了 cordova.js?”

文档类型是:

<!DOCTYPE html>

这是脚本参考:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="initial-scale=1, width=device-width, height=device-height" />
    <link rel="stylesheet" href="css/jquery.mobile.structure-1.3.0.min.css" />
    <link rel="stylesheet" type="text/css" href="css/index.css" />

    <script type="text/javascript" src="js/jquery.min.js"></script>
<script type='text/javascript' src='js/angular.min.js'></script>
<script type='text/javascript' src='js/angular-ui.js'></script>
<script type='text/javascript' src='js/jqm-setup.js'></script>
<script type="text/javascript" src="js/jquery.mobile.js"></script>
<script type="text/javascript" src="js/jquery-mobile-angular-adapter.min.js"></script>
    <script type="text/javascript" src="cordova-2.5.0.js"></script>
    <script type="text/javascript" src="js/index.js"></script>-->

仅当我删除 jquery 移动设备时,此错误才会消失...在此先感谢。

4

2 回答 2

1

我会避免在 PhoneGap 应用程序中使用 JQuery Mobile。我在 DC Droid Meet 上遇到了 Adob​​e PhoneGap 布道者 Andrew Trice,并听取了他在几个网络研讨会上的发言。我不止一次听他说过 JQuery Mobile 存在巨大的性能问题。如果可能,他建议使用其他框架。还有许多其他框架具有良好的设计、小部件和示例,使它们易于学习。我认为他甚至创建了自己的名为 AppUI。只要环顾四周,你就会发现一些非常酷的。

于 2013-08-08T04:11:14.903 回答
0

该错误绝对是它所说的:您的cordova.js 文件未正确包含。先解决这个问题。

回答你更大的问题:Angular、jQuery Mobile 和 PhoneGap 将一起使用,但它带有一些重要的警告。

最大的问题是 jQuery Angular Mobile 适配器目前被放弃,而他们花时间构建更好的解决方案:angular-jqm。这意味着适配器仅适用于过时版本的库。

第二:那些过时的库版本在使用 Windows Phone 时存在一些问题。这些也是可修复的,但会将您锁定在更难维护的版本中。

所以这里是设置:

<script src="javascripts/vendor/jquery-mobile-1.3.1.js"></script>
<!-- this angular-1.0.6 includes a patch to support WP8 URLs: https://github.com/angular/angular.js/issues/2303 -->
<script src="javascripts/vendor/angular-1.0.6.js"></script>
<script src="javascripts/vendor/jquery-angular-mobile-adapter-1.3.2.js"></script>

不幸的是,我永远无法通过 XHR 加载部分内容,因此我将所有页面都包含在 index.html 文档中。

<body ng-controller="AppController">
  <div data-role="page" id="first" ng-controller="FirstController">
    <h1>First Page</h1>
    <p>{{foo}}</p>
    <p><a href="#/second">Second Page</a></p>
  </div>
  <div data-role="page" id="second" ng-controller="SecondController">
    <h2>Second Page</h2>
  </div>
</body>

然后你需要关闭 JavaScript 中的一些细节并设置你的路由:

<script>
var so_example = angular.module('so_example', []).
  config(function ($routeProvider, $locationProvider, $compileProvider) {
    // turn off html5 mode so that we just navigate around using hashes
    $locationProvider.html5Mode(false).hashPrefix("");
    // allow for the odd URLs included in Windows Mobile PhoneGap
    $compileProvider.urlSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel|x-wmapp0):/);

    $routeProvider.
        when('/second', {
            templateUrl: '#second',
            jqmOptions: { transition: 'slide' } 
        }).
        when('/', {
            templateUrl: "#first"
        });
  }).
  controller("FirstController", function ($scope) {
    $scope.foo = "Hello, World!";
  }).
  controller("SecondController", function ($scope) {
  });
</script>

现在,在将 Angular 引导到 HTML 之前,您需要利用 Cordova 库:

var app = (function () {
  function onDeviceReady() {
    angular.bootstrap(document, ['so_example']);
    $.mobile.phonegapNavigationEnabled = true;
  }

  return {
    initialize: function() {
      document.addEventListener('deviceready', onDeviceReady, false);
    }
  };
})();
app.initialize();
于 2013-12-04T18:36:45.943 回答