角度路由一些奇怪的事情

Question

我还在学习angularjs所以也许有些东西很愚蠢我不理解但是在使用路由时我有一个非常奇怪的行为.

在我的应用程序中,我使用以下代码来定义我的路由:

var app = angular.module('app', []);
app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
  $routeProvider.
    when('/pneumatici/:chunka', {}).
    when('/pneumatici/:chunka/:chunkb', {});

  $locationProvider.html5Mode(true);
}]);

在控制器中我以这种方式管理它们:

app.controller('appCtrl', ['$scope', '$route', '$routeParams', '$location', function ($scope, $route, $routeParams, $location) {
  $scope.$on('$routeChangeSuccess', function (current,previous) {
    if (!($location.path().indexOf('/pneumatici') === -1)) {
      $scope.chunka = $route.current.params.chunka; $scope.chunkb = $route.current.params.chunkb;

      /** do my stuff with chunka and chunkb **/

    } else {
      window.location.href = $location.path();
    }
  });

我没有ngView,没有模板,没有.它就像一个魅力.

请注意我实际强制页面加载的行,以防网址不是由控制器appCtrl管理.我被迫这样做是因为一旦我定义我的路线以捕获'$ routeChangeSuccess',当点击时页面中的所有链接都被角度捕获并且即使链接没有使用'when'定义的格式也不会发生页面加载.我想用'否则'来做这件事,但我无法理解如何,如果可行的话.

现在问题. 在页面当然我有像'/privacy.html'的链接,如果我点击它们正确触发页面加载,我看到'/privacy.html'但不幸的是,如果我点击后退按钮,我可以看到浏览器的URL更改为(例如)/ pneumatici/foo/bar但不会触发页面加载.

请注意在privacy.html页面中我没有定义角度路由,没有.config no .when; 有一个带有控制器的anagular应用程序,但没有在任何地方注入'$ routeProvider',没有任何路由的定义.

怎么了？我做错了什么？

谢谢你的帮助!

更新. 我找到了一个可行的解决方案:

angular.element("a").prop("target", "_self");

对于'target'设置为"_self"的所有'a'元素,忽略角度路由,不知道这一点.

如果我整体看这个策略对我来说听起来不是很优雅,我很乐意改进它.我不喜欢的是因为我在.config中定义路由我应该能够告诉angular跳过任何与我在那里定义的格式/路径不匹配的url.

但我不知道这是否可行,有人知道吗？

Answer 1

通过打开 html5mode，您的应用程序应该表现得默认拦截网站上的所有内容（来自“/”。）

从这个角度来看，似乎 $location.path() 应该在您的显式覆盖中工作，但它并不是真正正确（$location.url()应该是）并且浏览器已经具有正确的 URL，因此也许您无法强制重新加载location.href =您特定浏览器中的location.href。

我不会沿着这条路走下去，而是会执行以下操作来使其干燥：

如果添加基本 href：

<base href="/pneumatici/"></base>

并在您的条款中替换/pneumatici/为：/when

$routeProvider.
    when('/:chunka', {}).
    when('/:chunka/:chunkb', {});

那么你应该只需要这个：

$scope.$on('$routeChangeSuccess', function (current,previous) {

    $scope.chunka = $route.current.params.chunka;
    $scope.chunkb = $route.current.params.chunkb;

  /** do my stuff with chunka and chunkb **/
});