Question

我正在尝试为我们的AngularJS应用程序创建指令。这样使用：

<div requires-permissions="['permission_1', ...]">
  This should only show if the user has appropriate permissions.
</div>

它的作用与ng-if相似，因为它将删除或替换元素。没有此指令，我将需要为每个这样的元素编写该代码：

<div ng-if="ctrl.User.has_permissions(['permission_1', ...])">etc.</div>

，每个控制器都需要对User服务的引用。我已经浏览了code for ng-if，但无法看到代码的开头或结尾。

我很确定我可以使用jqlite的remove函数删除元素。以后我该怎么替换？

Answer 1

我已经为您实现了类似的功能，它称为experimentIF

export function experimentIf(ngIfDirective, experimentsManager) {
    const ngIf = ngIfDirective[0];
    const NAME = 'experimentIf';

    return {
        restrict: ngIf.restrict,
        priority: ngIf.priority + 1,
        terminal: ngIf.terminal,
        transclude: ngIf.transclude,
        link: function ($scope, $element, $attr) {
            const experimentName = $attr[NAME];

            $attr.ngIf = function () {
                return experimentsManager.isExperimentEnabled(experimentName);
            };
            ngIf.link.apply(ngIf, arguments);
        }
    };
}

基本上，它在需要时重用ng-if的配置，并且仅更改断言部分。就我而言，这是使用experimentsManager服务。

当您注入ngIfDirective时会发生魔力。

复制ng-if以实现特定功能

1 个答案: