Question

我正在尝试使用以下代码更改控制器范围的过滤器时更新砌体容器。

$scope.toggleCardVisibility = function(cardType) {
    $scope.filters[cardType] = false === $scope.filters[cardType];

    $scope.$broadcast('masonry.reload');        
};

我的HTML中连接到范围的元素如下所示：

<div ng-show="$parent.filters.heart" class="card-wrapper">
    ...
</div>

单击按钮时会调用

toggleCardVisibility：

<button type="button" cardType="profileUpdate" class="btn btn-default selected" ng-click="toggleCardVisibility('profileUpdate');">
    ...
</button>

问题是这不能按预期工作。调用toggleCardVisibility函数时将显示/隐藏元素，但不会更新砌体容器。我认为这可能是一个时间问题，所以我尝试用下面的代码片段交换第一个代码片段：

$scope.toggleCardVisibility = function(cardType) {
    $scope.filters[cardType] = false === $scope.filters[cardType];

    window.setTimeout(function() {
        $scope.$broadcast('masonry.reload');
    }, 1);
};

现在 - 超时为1ms的片段起作用，非常烦人。有没有人知道如何解决这个问题？

可以在供应商https://github.com/passy/angular-masonry/blob/master/angular-masonry.js中找到masonry.reload事件的监听器。

Answer 1

为了使用$broadcast将事件向下调度到所有子范围，您必须通知已注册的$ rootScope.Scope侦听器。

$scope.$broadcast('masonry.reload');

应该是：

$rootScope.$broadcast('masonry.reload');

https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope

AngularJS砌体重装事件无法正常工作

1 个答案: