Question

app.directive('hidefileId',['$document','documentService',function($document,documentService){
    return{
        scope: false,
        restrict: 'AE',
        link : function($scope,element,attrs){
            element.on('click',function(e){
                angular.element('#fileId').removeClass("errorhilight");
                angular.element('#docerrormsg').html('');
            })

        }
    }

}]);

我的js控制器中有很多指令，当我使用以下指令时，我在

中获取父作用域

$ scope。$ parent。$ parent。$ parent。$ parent .//在这里我得到了我的控制器的范围。

即使我使用scope：false，它也在创建新的范围。

我只想使用我的控制器范围

Answer 1

您可以使用require指令选项。这将使您可以访问父控制器。如果无法找到控制器，则该指令抛出异常。您可以访问放在该控制器上的任何内容。如果您需要子指令需要访问父指令的父子关系，这是一个很好的方法。它还允许更多的模块化代码。

e.g。我编写了一个带有公开API的表指令，以向单元格添加格式。这非常有用，因为您可以编写许多其他表指令，这些指令可以在整个应用程序中互换使用。作为示例，我将向您展示一个子HoverTitle指令，该指令使用父表指令在给定单元格中添加悬停工具提示。

function HoverTitle(CellProcessService){
'ngInject';
return{
    require: '^cTable', // require c-table
    link: function(scope, element, attrs, cTable){

        cTable.addCellRenderProcess(renderCell, CellProcessService.priorities["HOVER-TITLE"]);
        function renderCell(curr, column, row){
            if(angular.isFunction(cTable.hoverClass)){
                var hoverTitle = cTable.hoverClass(row, curr, column);
                if(hoverTitle){ 
                    var placement = cTable.placement || 'right';
                    var tag = column.link ? "span" : 'a'
                    return '<' + tag + ' tooltip-placement="'+placement+'" uib-tooltip="' + hoverTitle + '">' + curr +'</ ' + tag + '>';
                }
            }
            return curr;
        }
    }
}

}

以下是如何使用它：

            <c-table
            table-sort
            hover-title
            data="$ctrl.data"
            columns="$ctrl.columns">
        </c-table>

https://docs.angularjs.org/guide/directive#creating-directives-that-communicate

如何避免在指令中调用`$ parent`作用域

1 个答案: