在 AngularJS 中使用相对路径进行服务调用

我有以下代码，在部署到测试服务器之前它工作正常：

$scope.getUserList = function (userName) {
    $http({
        method: "get",
        url: "GetUserList",
        params: { userName: userName }
    }).
        success(function (data) {
            $scope.users = data;
        }).
        error(function () {
            alert("Error getting users.");

问题是我部署到虚拟目录，下面的调用试图从服务器根目录访问 GetUserList。这是有道理的，而且我知道很多方法可以解决这个问题。

我想知道的是right以在 Angular 中可移植和可维护的方式引用服务 URL。

我建议在 head 中使用 HTML 基本标签，并编码与此相关的所有路径。例如，在 ASP.NET 中，您可以获得对应用程序基础的引用，该引用可能是也可能不是站点的根路径，因此使用基础标记会有所帮助。奖励：它也适用于所有其他资产。

你可以有一个像这样的基本路径：

<base href="/application_root/" />

...然后像“foo/bar.html”这样的链接实际上将是/application_root/foo/bar.html。

我喜欢使用的另一种方法是将命名链接放在标题中。我经常会在一个位置有一个 API 根，在其他位置有一个指令模板根。然后，我将在头部添加一些标签，如下所示：

<link id="linkApiRoot" href="/application_root/api/"/>
<link id="linkTemplateRoot" href="/application_root/Content/Templates/"/>

...然后在模块中使用 $provide 来获取链接 href 并将其公开给服务和指令，如下所示：

angular.module("app.services", [])
    .config(["$provide", function ($provide) {
        $provide.value("apiRoot", $("#linkApiRoot").attr("href"));
    }]);

...然后将其注入到这样的服务中：

angular.module("app.services").factory("myAdminSvc", ["apiRoot", function (apiRoot) {
    var apiAdminRoot = apiRoot + "admin/";
    ...

只是我的意见。为您的应用程序做最简单的事情。