angularjs-是否无法在指令上添加ng属性?

angularjs-是否无法在指令上添加ng属性?,angularjs,compilation,directive,Angularjs,Compilation,Directive,我希望能够为权限指令包装ng hide的行为。。。所以我可以做下面的事情 <a href="/" permit="false">Hide me</a> 或 我在没有优先权或终端的情况下尝试过,但没有任何效果。我尝试过许多其他的排列方式,包括删除“permit”属性以防止它继续重新编译,但归根结底似乎是这样的:似乎没有办法修改元素的属性并通过指令内联重新编译 我确信我遗漏了一些东西。此解决方案假定您希望在permit属性发生更改时观察其更改,并隐藏元素,就像它使用ng h

我希望能够为权限指令包装ng hide的行为。。。所以我可以做下面的事情

<a href="/" permit="false">Hide me</a>

我在没有优先权或终端的情况下尝试过,但没有任何效果。我尝试过许多其他的排列方式,包括删除“permit”属性以防止它继续重新编译,但归根结底似乎是这样的:似乎没有办法修改元素的属性并通过指令内联重新编译


我确信我遗漏了一些东西。

此解决方案假定您希望在permit属性发生更改时观察其更改,并隐藏元素,就像它使用ng hide指令一样。一种方法是观察permit属性的变化,然后在需要隐藏或显示元素时提供适当的逻辑。为了隐藏和显示该元素,您可以在其中的ng hide指令中复制该元素的角度


我正在使用这个指令。这与ng if类似,但它会检查权限

appModule.directive("ifPermission", ['$animate', function ($animate) {
    return {
        transclude: 'element',
        priority: 600,
        terminal: true,
        restrict: 'A',
        $$tlb: true,
        link: function ($scope, $element, $attr, ctrl, $transclude) {
            var block, childScope;

            var requiredPermission = eval($attr.ifPermission);
            // i'm using global object you can use factory or provider
            if (window.currentUserPermissions.indexOf(requiredPermission) != -1) {

                    childScope = $scope.$new();
                    $transclude(childScope, function (clone) {
                        clone[clone.length++] = document.createComment(' end ifPermission: ' + $attr.ngIf + ' ');
                        // Note: We only need the first/last node of the cloned nodes.
                        // However, we need to keep the reference to the jqlite wrapper as it might be changed later
                        // by a directive with templateUrl when it's template arrives.
                        block = {
                            clone: clone
                        };
                        $animate.enter(clone, $element.parent(), $element);
                    });
             }
        }
    };
}]);
用法:

<div if-permission="requiredPermission">Authorized content</div>

如果只想执行ng hide=false,为什么需要自定义指令?实际代码将根据用户拥有的权限确定是否在隐藏中执行true或false。您可以在指令中执行$element.hide$element.show。您不需要ng hide。@MajoB您的解决方案假设OP使用的是JQuery。我在作用域$watchattr.permit中遇到一些问题,并最终使用了以下代码:attr.$observe'permit',functionvalue{element['addClass']'ng-hide';}
directive('permit', ['$animate', function($animate) {
  return {
    restrict: 'A',
    multiElement: true,
    link: function(scope, element, attr) {
      scope.$watch(attr.permit, function (value){

        // do your logic here
        var condition = true; 
        // this variable here should be manipulated in order to hide=true or show=false the element. 
        // You can use the value parameter as the value passed in the permit directive to determine 
        // if you want to hide the element or not.

        $animate[condition ? 'addClass' : 'removeClass'](element, 'ng-hide');

        // if you don't want to add any animation, you can simply remove the animation service
        // and do this instead:
        // element[condition? 'addClass': 'removeClass']('ng-hide');
      });
    }
  };
}]);
angular.module('my.permissions', []).directive('permit', function($compile) {
  return {
    priority: 1500,
    terminal: true,
    link: function(scope, element, attrs) {
      scope.$watch(function(){
         var method = scope.$eval(attrs.permit) ? 'show' : 'hide';
         element[method]();
      });
    }
  };
});
appModule.directive("ifPermission", ['$animate', function ($animate) {
    return {
        transclude: 'element',
        priority: 600,
        terminal: true,
        restrict: 'A',
        $$tlb: true,
        link: function ($scope, $element, $attr, ctrl, $transclude) {
            var block, childScope;

            var requiredPermission = eval($attr.ifPermission);
            // i'm using global object you can use factory or provider
            if (window.currentUserPermissions.indexOf(requiredPermission) != -1) {

                    childScope = $scope.$new();
                    $transclude(childScope, function (clone) {
                        clone[clone.length++] = document.createComment(' end ifPermission: ' + $attr.ngIf + ' ');
                        // Note: We only need the first/last node of the cloned nodes.
                        // However, we need to keep the reference to the jqlite wrapper as it might be changed later
                        // by a directive with templateUrl when it's template arrives.
                        block = {
                            clone: clone
                        };
                        $animate.enter(clone, $element.parent(), $element);
                    });
             }
        }
    };
}]);
<div if-permission="requiredPermission">Authorized content</div>