angularjs路由页面切换问题

发布于 2021-12-04 06:11:36 字数 3455 浏览 785 评论 1

angularjs路由切换页面不起作用,无法切换页面。

整个angular项目如下:

index.html代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link href="css/bootstrap.css" rel="stylesheet" type="text/css">
        <link href="css/bootstrap-responsive.css" rel="stylesheet" type="text/css">
        <link rel="stylesheet" type="text/css" href="css/style.css">
        <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css">
        <link href="css/prettyPhoto.css" rel="stylesheet" type="text/css">        
        <title>AngularJS Practise Demo</title>
    </head>
    <body>
        <div data-ng-controller="AppCtrl">
            <div id="main" class="container" ng-view></div>
        
            <div data-ng-include=" 'views/navbar.html' "></div>
        </div>
        <script type="text/javascript" src="lib/require/require.js" data-main="scripts/main.js"></script>
    </body>
</html>



app/views文件如下:

app/scripts文件目录如下:

路由文件app/scripts/routes.js文件如下:

define([], function()
{
    return {
        defaultRoutePath: '/',
        routes: {
            '/': {//首页
                templateUrl: '/views/Common/home.html',
                dependencies: [
                    'controllers/homeController',
                    'directives/home-directive'
                ]
            },
            '/user': {//用户查询
                templateUrl: '/views/Common/user.html',
                dependencies: [
                    'controllers/userController',
                    'directives/user-directive'
                ]
            },
            '/dataquality': {//数据质量
                templateUrl: '/views/common/dataquality.html',
                dependencies: [
                    'controllers/dataqualityController',
                    'directives/dataquality-directive'
                ]
            },
            '/flow': {//流向流量
                templateUrl: '/views/common/flow.html',
                dependencies: [
                    'controllers/flowController',
                    'directives/flow-directive'
                ]
            },
             '/timemonitor': {//时限监测
                templateUrl: '/views/common/timemonitor.html',
                dependencies: [
                    'controllers/timemonitorController',
                    'directives/timemonitor-directive'
                ]
            }
        }
    };
});

路由已配置好,用node启动后,只显示主页,及home.html里面的东西,如下图:

点击用户查询,应该显示如下页面:

但是现在的问题是,点击用户查询并不会跳转页面,毫无反应,请问是什么原因呢?(路由已配置好)



如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

回忆凄美了谁 2021-12-04 07:44:45

打开console看看什么错吧。此外,自带的route好像用的少。一般用https://angular-ui.github.io/ui-router/site/这个多。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文