繁体   English   中英

Angular指令不会更新布尔值

[英]Angular directive won't update boolean

我的控制器中有一个函数可以切换类,并将$scope.logocollapsed值更改为true以隐藏元素。 当我使用ng-click调用其按设计工作的函数时,将添加类并将其值设置为true。

我创建了一个指令来切换类,并更改$scope.logocollapsed的值,这在滚动事件上被调用,并且它切换了类,但是不会更改$scope.logocollapsed的值

这是我的指令:

                .directive('scrollspy', function () {
                    return {
                        restrict: 'A',
                        link: function (scope, element, attrs) {
                            var raw = element[0];
                            console.log('loading directive');

                            element.bind( 'scroll', function() {
                                //console.log(raw.scrollTop);

                                if (! $('.sidebar-menu').hasClass('collapsed')){
                                    if (raw.scrollTop > 200) {
                                        scope.menuClose();
                                    }
                                }
                            });
                        }
                    };
                }) 

这是我的控制器内部的外观。

$scope.menuClose = function(bool) {
 if(! $('.sidebar').hasClass('collapsed')) {
     $('.sidebar-menu').addClass('collapsed');
     $scope.logocollapsed == true;
 }
};

同样,我不确定为什么我的指令能够运行menuClose()函数并处理该类,但是它不会将该值更新为false。

我感谢任何建议

乍一看,问题似乎在$scope.menuClose

这个:

$scope.logocollapsed == true;

应该是这样的:

$scope.logocollapsed = true;

==是比较运算符,而=是赋值运算符。

你有几个问题。

  • 如另一个答案中所述,您正在进行相等比较,而不是分配@ $scope.logocollapsed == true;

  • 必须执行scope.$apply才能在scroll事件中手动触发摘要周期。

    element.bind( 'scroll', function() { if (! $('.sidebar-menu').hasClass('collapsed')){ if (raw.scrollTop > 200) { scope.menuClose(); scope.$apply(); } } });

  • 在控制器中执行DOM操作或显式DOM访问被认为不是一个好习惯。 您可能应该将该代码if(! $('.sidebar').hasClass('collapsed')) {...移至指令链接器函数。 并且只有控制器功能设置该标志。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM