Angular 1.X控制器和指令

Question

之间的关系是什么？我不是问两者之间有什么区别，我想知道它们在组件的指令和控制器中是如何协同工作的。

Answer 1

我不确定为什么你对此表决不满意，因为我认为这是一个与角度1.x的不太清晰的方面有关的问题。

暴露指令的API

其中一个主要的原因，以建立与控制器的指令是揭露一个指令的API其他指令。一个很好的例子是ngModel和ngModelController。许多自定义指令都需要访问ngModel，这些指令也在声明自定义指令的地方或上方声明。

{ require:'^ngModel' } 

这实际上是说这个定制指令需要访问的ngModelController可用API做额外的工作：你可以通过该指令定义看到这一点。例如，你想要一个指令在特定的ngModel上做一些自定义的分析或格式化。在我的应用程序中，我不断收到从服务器返回的日期字符串的错误。我创建这个自定义指令来处理错误和正确格式化字符串（这是BTW的CoffeeScript）：

.directive 'dateString', [ 
()-> 
    { 
     priority: 10 
     require: 'ngModel' 
     link: ($scope, elem, attrs, ngModel)-> 
      ngModel.$formatters.push (val)-> new Date(val) 
    } 
] 

如果没有ngModelController，我不会有机会获得API来添加一个新的格式化功能。

因此，总而言之，我们可能会创建指令控制器来为可能在同一UI元素上操作的其他指令提供API。

经典控制器角色

为了折角的精神和意图内，使用控制器暴露的API，模板比试图用一个jQuery实现更好的。换句话说，最好这样做：

指令w。控制器

controller: function($scope){ 
    $scope.doSomething = function(){ ... } 
}, 
template: '<div><button ng-click="doSomething()">Click Me</button></div>' 

VS像这样

指令W上。 jquery-like的实现

link: function($scope, elem, attrs){ 
    elem('button').bind('click', function(){ ... }) 
}, 
template: '<div><button>Click Me</button></div>'