手动导航在 AngularJS 1.7 的 ui-router 中不起作用

不是程序员

我有以下状态配置:

function stateConfig($stateProvider) {
    $stateProvider
        .state("home", {
            url: "/",
            templateUrl: "/app/home/template/home.html",
            controller: "HomeController as homeController"
        });
        .state("user", {
            abstract: true,
            url: "/user",
            template: "<ui-view/>"
        })
        .state("user.list", {
            url: "/list",
            templateUrl: "/app/user/template/user.list.html",
            controller: "UserListController as userListController"
        });
}

user.list.html 包含一个用户表,home.html 包含指向 user.list.html 的链接:

<a class="btn btn-primary" ui-sref="user.list" role="button">View All Users</a>

当我启动应用程序并转到 时localhost:8080,它会显示我的 home.html。然后,当我单击“查看所有用户”按钮时,它会显示我 user.list.html 并且我看到一个用户表。Evething工作正常,但问题开始当我尝试重新加载页面(按F5),或者当我手动导航到localhost:8080/user/list它向我显示 404 错误页面。我的问题是:为什么会这样?

阿德里安·布兰德

这与 AngularJS 无关,而是与您的 Web 服务器有关。您需要配置用于将 404 错误路由到 home.html 的服务器。当您请求localhost:8080/user/list您的服务器时,找不到/user/list.

想想当你加载 localhost:8080 时会发生什么。你得到 home.html 并且你的 AngularJS 应用程序被初始化。当您将路由从 localhost:8080 更改为localhost:8080/user/list从 ui-router 触发的路由处理程序时。不会向 Web 服务器发送 http 请求。当您手动输入路由或按 F5 时,您会向 Web 服务器发送一个 http 请求,以查找服务器上不存在的资源 /user/list,因此您会收到 404 not found 错误。您需要配置 404 错误来加载 home.html,这将加载 AngularJS 应用程序。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章