angularjs视图仅在硬刷新上加载，而不在重定向上加载

2018-06-27 18:23:38

我正在研究我的角度应用程序，并设置了这样的路线


    angular.module('app', ['ngRoute'])
        .config(function ($routeProvider, $locationProvider) {
            $routeProvider.when('/', {
                template : "",
                controller : function($window) {
                $window.location.href = '/';
                }
            }).when('/test', {
                    redirectTo : '/test/dashboard'
            }).when('/test/dashboard', {
                    templateUrl : '../partials/dashboard.html',
                    controller : 'DashboardController'
            }).when('/test/unit', {
                    templateUrl : '../partials/unit.html',
                    controller : 'unitController'
            });
            $locationProvider.html5Mode(true);
    });

HTML是

<body ng-app="app">
    ...
    <div id="sidebar-wrapper" class="fill-height sidebar-nav">
      <ul class="tabRow nav nav-stacked">

        <li ng-class="{active: isActive('dashboard') }"><a id="dashboardLink" ng-href="#test/dashboard">Dashboard</a>
        </li>

        <li ng-class="{active: isActive('unit') }"><a id="unitLink" ng-href="#test/unit">Unit</a>
        </li>
      </ul>
    </div>
    ...
</body>

问题：

当我输入“/ test”时，该代码会将URL重定向到“/ test / dashboard”，但该页面的html没有显示。但是，当我使用该路线刷新页面时，它会在页面的内容区域中显示html。

当我在链接之间切换时，仪表板会显示，只是在第一次导航时才加载。

此外，当我将重定向更改为/ test / unit时，它会正确重定向并显示unit.html。

不知道是什么导致了这种行为。

任何帮助，将不胜感激。

我认为你需要在为你的$locationProvider配置html5Mode时指定requireBase: false

$locationProvider.html5Mode({
  enabled: true,
  requireBase: false
});

这是一个有效的plnkr演示

要获得更多关于部署的上下文，您应该了解这种形式的角度文档

它可以工作，如果你删除 -

$locationProvider.html5Mode(true);

或者，通过类似问题的答案，您可以添加 -

<base href="/" />

到你的<head /> 。

链接地址: http://www.djcxy.com/p/77607.html

上一篇: angularjs view loads only on hard refresh and not on redirect

下一篇: $httpProvider interceptor not working when $http is injected into a factory