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

时间:2015-07-26 15:47:03

标签: angularjs angular-directive

我的指令适用于Chrome但不适用于IE,据我所知,goTo函数未被调用,但是网址更新为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:     含量

1 个答案:

答案 0 :(得分:0)

我将模板更改为在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>