AngularJS + PhoneGap,路由不起作用

时间:2016-05-26 18:03:50

标签: angularjs cordova ngroute

当我使用phonegap时,我遇到手机路由问题。

浏览器上的路由工作但在移动设备上无效。

如果有任何问题,我可以提供更多代码。

route.js:

app.config(['$routeProvider','$locationProvider','$compileProvider', function($routeProvider,$locationProvider,$compileProvider) {

    $routeProvider
    .when('/', {
        templateUrl: '../login.html',
        controller: 'loginController'
    })
    .when('/home',{
        templateUrl:'../home.html',
        controller:'homeController'
    })
    .when('/profile', {
        templateUrl:'../myprofile.html',
        controller:'profileController'
    })
    .when('/reservations',{
        templateUrl:'../reservations.html',
        controller:'reservationController'
    })
    .when('/ordernow',{
        templateUrl:'../ordernow.html',
        controller:'ordercontroller'
    })
    .otherwise({
        redirectTo: "/home"
    }); 

    $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|chrome-extension):/);
    $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|mailto|chrome-extension):/);
}]);

2 个答案:

答案 0 :(得分:2)

经过几个小时的挣扎:

解决方案:从templateUrl

中删除“../”

答案 1 :(得分:1)

我猜这个特殊问题很久以前就已经解决了,但我在使用angular 1.6和cordova android app时遇到了类似的问题。

我正在使用templateUrl的正确路径,但仍然无法正常工作。

在花了一整天的时间浏览不同的文件并尝试不同的东西之后,我偶然发现了一个小小的谜团。我正在使用谷歌浏览器检查调试cordova应用程序,发现应用程序URL为

file:///android_asset/www/index.html#!/

当我导航到另一个页面时,我得到了URL

file:///android_asset/www/index.html#!/#%2faccounts

然后在调查时,我偶然发现了this

我在配置路由器时使用了以下内容

$locationProvider.hashPrefix('');

这似乎解决了我的问题。以下代码段:

var prakriya = angular.module("prakriya",["ngRoute"]);
prakriya.config(function($routeProvider, $locationProvider){
  $locationProvider.hashPrefix('');  //Added Line here
  $routeProvider
  .when("/", {
    templateUrl: "templates/workspace.html",
    controller: "workspace"
  });
});