$anchorScroll 指令在 IE 11 中不起作用答案

【问题标题】：$anchorScroll directive not working in IE 11$anchorScroll 指令在 IE 11 中不起作用
【发布时间】：2015-07-26 15:47:02
【问题描述】：

我的指令适用于 Chrome，但不适用于 IE，据我所知，goTo 函数没有被调用，但 url 更新为 http://localhost:3000/#top。请帮忙。请参阅下面的代码。

指令：

(function() {
    'use strict';

    angular.module('app.widgets').directive('mmScrollTo', mmScrollTo);

    mmScrollTo.$inject = ['$anchorScroll', '$location', '$window'];

    function mmScrollTo ($anchorScroll, $location, $window) {
        // Usage:
        //     <directive1></directive1>
        // Creates:
        // 
        var directive = {
            link: link,
            restrict: 'EA',
            bindToController: true,
            controller: ScrollToController,
            controllerAs: 'vm',
            templateUrl: 'app/widgets/mm-scroll-to.html'
        };
        return directive;

        function link(scope, element, attrs) {
            angular.element($window).bind("scroll", function() {
                if (this.pageYOffset > 100) {
                    scope.display  = true;
                } else {
                    scope.display  = false;
                }
                scope.$apply();
            });
        }

        /* @ngInject */
        function ScrollToController ($anchorScroll, $location) {
            var vm = this;   
            vm.goto = function(x) {
                var newHash = x;
                if($location.hash() !== newHash) {
                    $location.hash(x);
                } else {
                    $anchorScroll();
                }
            }
        }
    }
})()

模板：

<div ng-show="display" class="scroll-to animate-show">
<a href="" ng-click="vm.goto('top')"><i class="fa fa-angle-double-up fa-2x"></i></a>

HTML: 内容

【问题讨论】：

标签： angularjs angular-directive

【解决方案1】：

我将模板更改为在 href 属性中添加哈希，现在它可以工作了。

    <div ng-show="display" class="scroll-to animate-show">
<a href="#" ng-click="vm.goto('top')"><i class="fa fa-angle-double-up fa-2x"></i></a>

【讨论】：