在准备好Phonegap设备之后初始化我的angularJs应用

小编典典

在准备好Phonegap设备之后初始化我的angularJs应用

angularjs

我有一个使用AngularJS的phonegap应用程序。

在我的应用程序上，我正在使用NetworkStatus插件来确认手机正在使用的连接类型。

在我的根路由上，我正在解析对服务的调用，该调用调用DeviceService，它负责访问navigator.network.connection.type并确定连接是打开还是关闭。解决方案（通过路由解析功能）将一个connectionState变量发送到控制器，该变量声明连接状态。

如果连接不可用，在那条路线上我想抛出一个错误。

话虽如此，我的问题是在访问我的路由后引发了DeviceReady事件。因此我的路线解析无法完成连接验证。

如何同步只有在DeviceReady事件触发后才能启动我的角度应用程序？

阅读 214

2020-07-04

共1个答案

小编典典

从AngularJs中获得进样器模块错误通常意味着您拼错了模块的名称，或者Angle根本找不到它。

如果Angular应用程序本身可以正常工作（例如，未包装在phonegap中），则意味着此问题按加载index.html时发生的顺序进行。

Cordova / PhoneGap加载您的索引页面
它的Webview解析它并加载其脚本标签
如果某些代码未包装在函数或对象中，则立即执行
Phonegap发送事件deviceready以告知您的应用程序其与本机代码的桥接已准备就绪

最后2个操作可以同时执行，但最常见的是我给您的操作。因此，例如，如果您通过ng-
app将您的angular模块名称放在html或body标签上，则angular会在找到它时尝试加载它。

因此，要使其正常工作，您需要：

YourAppName从html / body标签中删除
通常创建您的角度模块（其名称必须在引导程序和模块调用中匹配）
使用deviceready事件作为触发来增强应用程序的触发器

例如（简短的例子，头中只有css）：

<body>
    <div class="app">
        <h1>PhoneGap</h1>
        <div id="deviceready" class="blink">
        {{2+2}}
        </div>
    </div>
    <script type="text/javascript" src="phonegap.js"></script>
    <script type="text/javascript" src="js/angular.min.js"></script>
    <script type="text/javascript">
        document.addEventListener('deviceready', function onDeviceReady() {
            angular.bootstrap(document, ['YourAppName']);
        }, false);

        var YourAppName = angular.module('YourAppName', []);
    </script>
</body>

如果您想自己理解这一点，建议您放置一些console.log以获得事物的顺序。
您也可以使用Chrome DevTools远程调试，如果您的PC上装有Chrome 32+，而手机上只有android
4.4，或者只有PC却在模拟器上进行调试，则效果很好。很高兴看到错误和内容。首先调试Webview有点奇怪，但是对跟踪错误确实有用！

希望这可以帮助

2020-07-04