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

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.//在这里，我得到了控制器的范围。

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

我只想使用我的控制器作用域

Answer 1

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

例如 我编写了一个带有公开 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