AngularJs - 单击索引页面上的任何链接时会重新加载我的视图

时间:2014-02-11 18:37:10

标签: angularjs angularjs-routing

我有一个AngularJs应用程序,启动页面为index.html,我默认将用户路由到项目页面。问题是每当我点击index.html页面中的下拉切换链接时,项目部分视图都会重新加载,而不应该重新加载。请参阅以下代码:

的index.html

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
</head>
<body>
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
                            <i class="icon-tasks"></i>
                            <span class="badge badge-grey">4</span>
                        </a> 

<div ng-view></div>
</body>

app.js

 $routeProvider
    .when('/projects',
    {
       controller: 'projectController',
       templateUrl: '/app/views/projects/projects.html'
    })       
    .when('/suppliers',
    {
       controller: 'supplierController',
       templateUrl: '/app/views/suppliers/suppliers.html'
    })       
    .otherwise({ redirectTo: '/projects' });

另外,我尝试使用$ locationProvider.html5Mode(true);从网址中删除“#”并重新加载已停止,但我的网址(http://localhost/index.html#/projects)变为此http://localhost/projects,我将获得404.任何想法如何解决部分视图重新加载问题?

1 个答案:

答案 0 :(得分:1)

我强烈建议您使用ui.router管理子视图,这似乎符合您的需求。

github here

A good introduction to ui-router