Ionic 应用程序在浏览器上可以正常工作，但在我的 android 设备上不能正常工作答案

【问题标题】：Ionic app works true on browser but does not work fine in my android deviceIonic 应用程序在浏览器上可以正常工作，但在我的 android 设备上不能正常工作
【发布时间】：2016-08-14 12:16:10
【问题描述】：

我开发了一个离子应用程序，它在 chrome 中运行良好，但在生成 .apk 文件后它不能正常运行。 chrome开发者模式下只有警告：

SVG's SMIL animations (<animate>, <set>, etc.) are deprecated and will be removed. Please use CSS animations or Web animations instead.

详情如下：

我只使用 ng-cordova 插件和 maps.google 。
我使用打字稿
我使用http://ionicframework.com/docs/guide/publishing.html 来生成.apk。

在安卓设备上安装应用程序后，它运行但只显示我的父视图：

我有一个 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>

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>


    <script src="lib/ngCordova/dist/ng-cordova.js"></script>
    <script src="cordova.js"></script>

    <script src="http://maps.google.com/maps/api/js?key=My_Api_Kei"></script>

    <script src="my_apps_js"></script> </head>

<body dir="rtl" ng-app="appName">
    <ion-nav-view animation="slide-right-left"></ion-nav-view> </body> </html>

这是我的运行和配置函数：

    export var ehmcoModule = angular.module('ModuleName', ['ionic', 'ngCordova']); 

  ehmcoModule.run(function($ionicPlatform: ionic.platform.IonicPlatformService) {
    $ionicPlatform.ready(function() {

      if (window.cordova && window.cordova.plugins.Keyboard) {
        cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        cordova.plugins.Keyboard.disableScroll(true);
      }
       if (window.StatusBar) {
          //org.apache.cordova.statusbar required
         StatusBar.styleDefault();
       }
    });   });

  ehmcoModule.config(function($stateProvider: ng.ui.IStateProvider, $urlRouterProvider: ng.ui.IUrlRouterProvider) {
    $stateProvider
      .state('app', {
        url: '/app',
        abstract: true,
        templateUrl: 'templates/menu.html',
        controller: Controllers.EhmcoController.controllerName
      })
      .state('app.home', {
        url: '/home',
        views: {
          'menuContent': {
            templateUrl: 'templates/home.html',
            controller:Controllers.HomeController.controllerName
          }
        }
      })
      .state('app.category', {
            url: '/category',
            views: {
                'menuContent': {
                    templateUrl: 'templates/category.html',
                    controller:Controllers.CategoryController.controllerName
                }
            }
      })


    $urlRouterProvider.otherwise('/app/home');   });

我不认为这是一个路由问题，因为我在父视图的菜单中添加了一个项目并将其路由到第一页（应用程序/主页）。它去了那里，但角度库没有在那里加载并且绑定值没有显示。

【问题讨论】：

您是否尝试过，只是为了运行ionic run android --device？不要从发布构建开始，尝试先进行调试构建。
是的，我试过了。应用程序以我上面描述的相同状态启动。
这是一篇关于此类问题的好文章（但它并没有解决我的问题）：gonehybrid.com/…
开始\Android\android-sdk\tools\monitor.bat。使用该工具，您可以获得设备的控制台输出。希望，这能给你一些提示......
通过使用usb调试和运行命令：ionic run android -l -c application在我的表中工作正常，但在使用apk安装的应用程序中存在同样的问题！

标签： javascript angularjs cordova ionic-framework

【解决方案1】：

我终于解决了这个问题。我正在使用打字稿，控制器中的注入存在一些问题。它在浏览器中工作正常，但在生成 apk 文件后它不能正常工作。为了首先找到这样的问题，我们可以使用'ng-strict-di'指令：

 <body dir="rtl" ng-app="Ehmco" ng-strict-di>
    <ion-nav-view animation="slide-right-left"></ion-nav-view>
  </body>

除了激活我们设备的usb调试模式后，我们可以通过命令运行我们的应用程序：

ionic run --device

或

ionic cordova run --device android
ionic cordova run --device ios

然后在

chrome://inspect/#devices

我们可以调试我们的应用程序并查看问题。

【讨论】：