是否可以使用AngularJS指令来管理一系列条件？

我是AngularJS的新手，目前我的项目有一个菜单，有时只需要显示

因此，我有：

<div class="iframe-hide" 
     ng-show="$state.includes('deposit.card.start')||
              $state.includes('deposit.card.3ds')||
              $state.includes('deposit.card.waiting')||
              $state.includes('deposit.bank')||
              $state.includes('deposit.x')||
              $state.is('deposit.x.start')||
              $state.is('deposit.y.start')||
              $state.is('deposit.y.frame')">

Html将改为：

<div class="iframe-hide" show-if-true="includeMenu">

如果我把它连接起来：

.directive("showIfTrue", ["$", "$rootScope", (r, s) => { return ShowIfTrueDirective.build(r,s); }])

如果我设法获取范围数据，那么这可能会起作用，但这是我使用Anglular的第一周，并不完全确定我在做什么。有更好的解决方案吗？

我设法解决了这个问题：

export class NgHideDirective {
    static $inject = ["$rootScope"];
    static $rootScope: any;

    public static build($rootScope) {
        var directive: ng.IDirective = {
            link: (scope, element, attributes: any) => {

                var itemToHide = attributes["ngHide"]; 

                $rootScope.$on('$stateChangeStart',
                    (event, toState) => {
                        if (toState.data.hasOwnProperty(itemToHide)) {
                            element.hide();
                        } else {
                            element.show();
                        }
                    });
            }
        };
        return directive;
    }
}

因此，如果我们现在对元素执行此操作：

<div class="iframe" ng-hide="hideMenu">

然后div将被隐藏

但是，由于某种原因刷新页面时，这不起作用

我设法解决了这个问题：

export class NgHideDirective {
    static $inject = ["$rootScope"];
    static $rootScope: any;

    public static build($rootScope) {
        var directive: ng.IDirective = {
            link: (scope, element, attributes: any) => {

                var itemToHide = attributes["ngHide"]; 

                $rootScope.$on('$stateChangeStart',
                    (event, toState) => {
                        if (toState.data.hasOwnProperty(itemToHide)) {
                            element.hide();
                        } else {
                            element.show();
                        }
                    });
            }
        };
        return directive;
    }
}

因此，如果我们现在对元素执行此操作：

<div class="iframe" ng-hide="hideMenu">

然后div将被隐藏

但是，由于某种原因刷新页面时，这不起作用

.state("deposit.x.rejected", {
url: "/rejected",
templateUrl: "app/deposit/templates/x/rejected.html",
data: { hideDepositMenu: null }