一個angularjs指令是否需要它自己？

Question

指令是否需要自己？下面是一個example：

app.directive('menu', function() { 
    return { 
    restrict: 'E', 
    require: '?^menu', 
    link: function(scope, element, attrs, ctrl) { 
     console.log('ctrl: ', ctrl); 

     if (ctrl) { 
     element.addClass('nested'); 
     } else { 
     element.addClass('notnested'); 
     } 
    } 
    }; 
}); 

在我的測試似乎不工作（ctrl總是未定義）。見plunk

---

順便說一句，這個問題得到回答後，我發現，在這種情況下插入符號（^）沒有任何影響，並傳遞給鏈接功能控制器始終是實例的自己的控制器。 [plunk]

Answer 1

您應該直接定義控制器功能指令API暴露給其他指令：

app.directive('menu', function() { 
    return { 
    restrict: 'E', 
    require: '?^menu', 
    controller: function($scope){ }, 
    link: function(scope, element, attrs, ctrl) { 
     console.log('ctrl: ', ctrl); 

     if (ctrl) { 
     element.addClass('nested'); 
     } else { 
     element.addClass('notnested'); 
     } 
    } 
    }; 
}); 

見http://plnkr.co/edit/cKFuS1lET56VOOYD5rrd?p=preview

Answer 2

我想這裏的問題是不是與指令引用本身。在指定或定義之前，指令將不知道要引用哪個控制器。要訪問控制器，必須在指令中定義或引用它，如下所示。

app.directive('menu', function() { 
    return { 
    restrict: 'E', 
    controller: 'MainCtrl', 
    require: ['?^menu'], 
    link: function(scope, element, attrs, ctrl) { 
     console.log('ctrl: ', ctrl[0]); 
     if (ctrl) { 
     element.addClass('nested'); 
     } else { 
     element.addClass('notnested'); 
     } 
    } 
    }; 
}); 

Answer 3

隨着角1.4倍，你居然現在可以限制require聲明父元素僅和排除元素本身。如果更改 require: '?^menu'到require: '?^^menu'（注意第二尖號），讓你得到

app.directive('menu', function() { 
    return { 
    restrict: 'E', 
    require: '?^^menu', 
    controller: function($scope){ }, 
    link: function(scope, element, attrs, ctrl) { 
     console.log('ctrl: ', ctrl); 

     if (ctrl) { 
     element.addClass('nested'); 
     } else { 
     element.addClass('notnested'); 
     } 
    } 
    }; 
}); 

代碼現在將按預期。

請參閱http://plnkr.co/edit/2uDUO0LcgDX7xEuBtsJ2?p=preview