ngRoute 在 Phonegap 中不起作用答案

【问题标题】：ngRoute not working in PhonegapngRoute 在 Phonegap 中不起作用
【发布时间】：2014-07-22 02:57:24
【问题描述】：

有没有人在 Phonegap 应用程序中使用 Angulars ngRoute 解决了路由问题？我还没有弄清楚...尝试了不同的灵魂，但没有一个有效。这是最新的。有什么建议么？有没有其他更好的导航方式，或者我必须包含 jQuery 并制作一些完全其他的解决方案？

索引.html

<!DOCTYPE html>
<html>
<head ng-app="myApp">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

    <link href="lib/angular-mobile-ui/dist/css/mobile-angular-ui-base.min.css" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <title>Test</title>
</head>
<body ng-controller="MainCtrl">

        <div ng-view=""></div>

    <script type="text/javascript" src="cordova.js"></script>
    <script src="lib/angular-mobile-ui/dist/js/mobile-angular-ui.min.js"></script>
    <script src="lib/angular/angular.js"></script>
    <script src="lib/angular/angular-route.min.js"></script>

<script src="js/app.js"></script>

    <script src="js/app/controllers/controllers.js"></script>

    <script src="lib/phonegap.js"></script>

</body>
</html>

app.js

var myApp = angular.module("myApp", [ 'ngRoute','controllers', 'mobile-angular-ui', 'PhoneGap']);



myApp.config([$routeProvider,
    function ($routeProvider) {

    $routeProvider

            .when('/', {
                templateUrl: '/index.html',
                controller: 'MainCtrl'


            })
            .when('/partials/intro', {
                templateUrl: '/partials/intro.html',
                controller: 'IntroCtrl',
                template: '<h1> {{ test }} </h1>'

            })

            .when('/partials/about', {
                templateUrl: '/partials/about.html',
                controller: 'AboutCtrl'
            })
.otherwise({
                redirectTo: '/index'
            });

}

]);

controllers.js

'use strict';

var myApp = angular.module('controllers', []);

myApp.controller("MainCtrl", function ($scope, $location, PhoneGap) {

});

//This is the controller that should be loaded in to the MainCtrl

myApp.controller("IntroCtrl", function ($scope, $location, PhoneGap) {
    $scope.isAppLoaded = false;
    // to detect if app is loaded
    PhoneGap.ready().then(function () {
        alert("App is loaded!");
        $scope.isAppLoaded = true;
    });

    $scope.gotoIntro = function () {
        $location.url('/intro');
    };
});

【问题讨论】：

你看过 ionic - ionicframework.com

标签： javascript angularjs cordova angularjs-ng-route

【解决方案1】：

我猜这可能是罪魁祸首：

...
myApp.config([$routeProvider,
    function ($routeProvider) {
...

改成

...
myApp.config(['$routeProvider', //<-- Enclose this in "quotes"
    function ($routeProvider) {
...

或者，您可以简单地使用

...
myApp.config(function ($routeProvider) { /* Your code goes here */ });
...

【讨论】：

感谢您指出这一点。虽然它没有解决我的问题。
@MichaelR 你试过在浏览器上打开应用程序吗？你能找到任何错误信息吗？
不，我还没有。但是这次我将在浏览器中重新制作这个应用程序，没有phonegap，然后我会在它完成时在它上面实现phonegap。现在我正在从头开始在 Windows Phone 模拟器中开发......这是一个非常糟糕的决定。如果以后问题相同，我会回信。感谢您的宝贵时间！
@MichaelR 随时。通常，我会将 PhoneGap 应用程序开发为普通的 Web 应用程序，并定期编译以在真实设备上对其进行测试。