Question

我是混合应用程序开发的新手，我正在尝试在angularJS中创建一个应用程序，（Not IONIC）。我的应用程序在浏览器中加载速度很慢但它可以工作，但它在移动应用程序中根本不起作用。我正在使用grunt服务它。但似乎无法弄清楚如何使它在移动设备上工作.. 的index.html

<!DOCTYPE html>
<html lang="en" ng-app="app">
 <head>
<title>Quiz App</title>
<!--Stylesheets-->
<!--Bootstrap-->
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />

<!-- injector:css -->
<link rel="stylesheet" href="styles/challenge.css">
<link rel="stylesheet" href="styles/discussion.css">
<link rel="stylesheet" href="styles/game.css">
<link rel="stylesheet" href="styles/login.css">
<link rel="stylesheet" href="styles/loginMail.css">
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="styles/profile.css">
<link rel="stylesheet" href="styles/ranking.css">
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/subjects.css">
<link rel="stylesheet" href="styles/topics.css">
<!-- endinjector -->

<script src="cordova.js"></script>
<!--Scripts-->
<!-- JQuery-->
<script type="text/javascript" src="bower_components/jquery/dist/jquery.js" ></script>
<!-- AngularJS-->
<script type="text/javascript" src="bower_components/angular/angular.js"></script>
<script type="text/javascript" src="bower_components/angular-route/angular-route.js"></script>
<!--<script type="text/javascript" src="bower_components/angular-animate/angular-animate.js"></script>
<script type="text/javascript" src="bower_components/angular-touch/angular-touch.js"></script>-->
<!--Supersonic-->
<!--<script type="text/javascript" src="bower_components/supersonic/supersonic.js"></script>
<script type="text/javascript" src="bower_components/supersonic/supersonic.core.js"></script>-->
<!--Bootstrap-->
<script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.js"></script>


<!-- Application -->
<!-- injector:js -->
<script src="scripts/App.js"></script>
<script src="scripts/config/Route.js"></script>
<script src="scripts/services/DiscussionService.js"></script>
<script src="scripts/services/ProfileService.js"></script>
<script src="scripts/services/RankingService.js"></script>
<script src="scripts/services/SubjectService.js"></script>
<script src="scripts/controllers/0-ExamBattleController.js"></script>
<script src="scripts/controllers/Body/0-BodyController.js"></script>
<script src="scripts/controllers/Body/BodyController.js"></script>
<script src="scripts/controllers/ChallengeController.js"></script>
<script src="scripts/controllers/DiscussionController.js"></script>
<script src="scripts/controllers/GameController.js"></script>
<script src="scripts/controllers/LoginController.js"></script>
<script src="scripts/controllers/ProfileController.js"></script>
<script src="scripts/controllers/RankingController.js"></script>
<script src="scripts/controllers/SubjectController.js"></script>
<!-- endinjector -->

</head>
<body id="body">
<!--<p>App has loaded</p>-->
<div id="main" ng-view></div>

</body>
</html>

这是我的app run和config

var BaseImagesUrl = 'images/';
var BaseTemplateUrl = 'templates/';

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

app.run(function($rootScope, $timeout, $location, $route){
    $rootScope.login = {};
    $rootScope.test = "Hello World";
    alert("app is running");
    console.log($route);
});

配置到这里：

app.config(function($locationProvider,$routeProvider) {

$routeProvider
    .when('/', {
        templateUrl: BaseTemplateUrl + 'login.html',
        controller: 'LoginController'
    })
    .when('/loginMail', {
        templateUrl: BaseTemplateUrl + 'loginMail.html',
        controller: 'LoginController'
    })
     .otherwise({
        redirectTo: '/'
    });

});

Answer 1

请尝试启动onDeviceReady中的角度应用。

onDeviceReady : function() {
   angular.element(document).ready(function() {
      angular.bootstrap(document, ['examBattle']);
 });

}

删除ng-app

谢谢，马丹

Answer 2

您应该使用cordova CLI创建项目。

像这里：https://cordova.apache.org/docs/en/5.0.0/guide_cli_index.md.html#The%20Command-Line%20Interface

几个月前我遇到过很多关于cordova的问题，所以我将我的源码转移到了一个使用CLI创建的新项目，一切正常。

当您转到CLI时，您应该考虑的最重要的事情是CLI编译器为您提供的有关调试的信息。

没有屏幕显示在移动应用程序中，WebApp正常工作

2 个答案: