Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

$anchorScroll breaks anchor links with html5mode enabled #14315

@lookfirst

Description

@lookfirst

I boiled this problem down to a very simple test case included below. Apologies if this has been reported before, but I did search around first for this.

Just by simply injecting $anchorScroll and not even calling it anywhere in the code, all anchor href's are broken. The value in the location bar changes, but navigation to the new link does not work.

Disabling html5Mode works.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>boo</title>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.2/angular.min.js"></script>
        <base href="/">
    </head>

    <body ng-controller="MyCtrl">

        <a href="/nogo">GOOOOOOO</a>

        <script type="text/javascript">
            angular.element(document).ready(function() {    
                var appModule = angular.module('appModule', []);

                appModule.config(['$locationProvider', function($locationProvider) {
                    $locationProvider.html5Mode({
                        enabled: true
                    });
                }]);

                appModule.controller('MyCtrl', ['$anchorScroll', function($anchorScroll) {}]);
/*
                appModule.controller('MyCtrl', function() {});
*/

                return angular.bootstrap(document.body, [appModule.name], {
                    strictDi: true
                });
            });
        </script>
    </body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions