AngularJS 路由在 PhoneGap 中无法正常工作

Question

我一直在用头撞墙，试图弄清楚为什么 angularJS 路由对我来说在 phonegap 中不起作用。我已经正确设置了所有文件，并且没有收到任何错误。我正在尝试直接从 angular 使用 $location.url 服务更改 url。因此，当您点击 div 时， Controller 将具有 $location.url("profile") 例如，并且不会发生任何事情。我尝试了在此 stackoverflow 中找到的解决方案但这对我不起作用。我做错了什么，还是有更好的方法来解决这个问题？以下是我设置的路由

var app = angular.module("App", ["hmTouchevents"])
.config(function($routeProvider) {

$routeProvider
    .when("/index.html", {
        templateUrl: "/views/login.html",
        controller: "loginCtlr"
    })
    .when("/landing", {
        templateUrl: "/views/landing.html",
        controller: "landingCtlr"
    })
    .when("/single-view/:id", {
        templateUrl: "/views/single-view.html",
        controller: "singleViewCtlr"
    })
    .when("/restaurant", {
        templateUrl: "/views/restaurant-info.html",
        controller: "restaurantCtlr"
    })
    .when("/profile/:id", {
        templateUrl: "/views/profile.html",
        controller: "profileCtlr"
    })
    .when("/lists/:list", {
        templateUrl: "/views/lists.html",
        controller: "listsCtlr"
    })
    .when("/follow/:type", {
        templateUrl: "/views/follow.html",
        controller: "followCtlr"
    });

});

示例 Controller 将是:

app.controller("listsCtlr", ["$scope", "$location", function($scope, $location){

$scope.goTo("profile");

}]);

与往常一样，非常感谢任何帮助。

Answer 1

我今晚遇到了类似的问题。这里的核心问题是PhoneGap 没有内置Web 服务器。如果您在本地开发，您可能正在使用Web 服务器，因此您可以执行以下操作:http://localhost/#/profile并且路由将起作用。

但是，PhoneGap 会使用 file:// 加载您的代码。 URL，不是 http:// .如果你这样做 $location.url("profile")你只是用 file://profile 替换整个 URL ，它不存在。如果你使用这样的链接，同样的事情:<a href="/#/profile">My Profile</a>
解决方案是以某种方式让您的链接指向正确的位置。如果您使用的是 $location.url()你可以用你的文件路径作为前缀:$location.url( window.location + "#/profile" )
如果你只是创建一个链接，你应该可以去掉前导斜杠使其成为一个相对 URL:<a href="/#/profile">My Profile</a>变成 <a href="#/profile">My Profile</a>