Question

我对Angular很新，我遇到了以下问题：

我有一个列表视图和带有一些标签的详细信息视图。我创建了一个指令，以便在click事件中更改路径（到列表视图）并从服务加载新元素。我想要的是click事件也改变了一个范围变量，这样我就可以显示/隐藏一个按钮来清除列表视图中的过滤器。

实际上我可以从指令中更改变量，但是当变量发生变化时，按钮不会显示/隐藏ngIf / ngShow / ngHide。

我在指令和控制器中尝试使用$scope.$apply。我尝试从控制器调用toggle函数并直接在指令中更改变量，但没有任何效果。

我尝试从另一个按钮调用切换功能，它完美无缺！

这是我的代码：

在这里，我尝试更改指令中的变量$apply：

.directive('filterTag', function(getFeed, $location) {
    return {
        restrict: 'A',
        controller: 'mainController',
        link: function(scope, element, attrs) {
            element.bind('click', function() {
                $location.path('/list');
                scope.filtered = true;
                scope.$apply();
                return getFeed.getTagged(this.text);

            });
        }
    }
})

这是在控制器内部：

$scope.filtered = false;
$scope.toggleFiltered = function() {
    $scope.filtered = !$scope.filtered;
}

$scope.$watch('filtered', function() {
    alert('filtered: ' + $scope.filtered);
});

我使用$ watch来确保变量正确无误，无论是从指令还是从切换按钮都可以。

如果要应用过滤器，我想显示/隐藏的按钮（这在列表视图中）：

<button type="button" ng-show="filtered">Clear filter</button>

我尝试添加此按钮以检查我是否遗漏了某些内容或语法错误，但它完美无缺

<button type="button" ng-click="toggleFiltered()">toggle filter</button>

我在过去两天寻找答案，但我找不到解决方案。我的代码无法解决问题。

工作示例here

Answer 1

您可以在两个控制器（不同的范围）之间共享“已过滤”，因此您可以使用$rootScope执行此操作，或者在“过滤”更改时以这种方式使用service/factory在任何控制器中，它将在另一个控制器中发生变化！

使用$ rootScope.filtered而不是$ scope.filtered，您可以在模块的run（）函数中初始化$ rootScope.filtered。

从angularJS中的指令更改范围变量

1 个答案: