javascript - 使用 ng-hide/show 和 bool 值时切换 <a> 标记失败

Question

我有一个向上箭头，应该 ng-hide如果this.showUpArrow等于 false 且 ng-show如果this.showUpArrow等于假。 this.showUpArrow设置为false页面加载时仅切换到 true当页面顶部到达指定的div时的.offsetTop 。我让它识别何时应该将 bool 值转换为 true一旦达到div很好，花花公子。问题是它不是 ng-show荷兰国际集团<a>我希望它在 this.showUpArrow 时显示的标签设置为true 。给出了什么？

这是我的 HTML...

<a href='' id='up-arrow-link' ng-click='landingControl.goToAnchor("wrapper")'>
    <img id='up-arrow' src='../static/images/uparrow.png' ng-hide='!landingControl.showUpArrow' ng-show='landingControl.showUpArrow'>
</a>

这是我的 Angular Controller ...

myModule.controller('landingController', function($location, $anchorScroll, $window){
var _this = this;
this.showUpArrow = false;

    angular.element($window).bind("scroll", function() {
        var elem = angular.element('#mystory')[0].offsetTop
        var topOfScreen = $window.scrollY;
        if (topOfScreen >= elem) {
            _this.showUpArrow = true;

        }
    });
})

值得一提的是landingControl我的一部分ng-hide和ng-show声明引用了我的 Controller 。我正在使用this方法而不是 $scope方法。

Answer 1

您需要使用 $scope.apply 或 $timeout 调用摘要周期。

$apply() is used to execute an expression in angular from outside of the angular framework. (For example from browser DOM events, setTimeout, XHR or third party libraries). Because we are calling into the angular framework we need to perform proper scope life cycle of exception handling, executing watches.¹

这通常在指令中完成。