Question

我写了一个属性限制的Angular指令（restrict:'a'），它为textarea添加了功能。将它应用于任何其他类型的元素是没有意义的。

添加if (element.nodeName == 'TEXTAREA') {非常脏且不可靠。

我尝试向其添加require: textarea，但它不起作用，我收到此错误：Error: No controller: textarea

问题：是否有更清洁的方法来正确应用此限制？

编辑：第一个答案后的附加约束。

我想避免在此指令中使用模板，因为我希望能够使用此类型的多个指令。这是我想要的一个例子：

<textarea splittable shared mergeable></textarea>

Answer 1

当您使用自己的指令（例如my-textarea）和restrict: 'E', replace: true时，任何其他属性都会将转移到指令的根元素，甚至其他属性指令。所以：

<my-textarea splittable class="foobar"></my-textarea>

可以呈现为：

<textarea splittable="" class="foobar"></textarea>

执行splittable。

演示：http://jsfiddle.net/LMq3M/

所以我认为使用你自己的指令实际上是处理这个问题最干净的方法。

Answer 2

在我看来，没有必要添加这样的控件，因为当真正的问题是人为错误时，它们往往会添加复杂的代码。

只需记录指令的用途和用途。

Answer 3

这个想法是你给你的指令一个唯一的名字，比如myDirective，你可以在HTML中使用它。

<body>
    <my-directive></my-directive>
</body>

该指令将使用您在指令控制器中提供的模板替换标记。在您的情况下，可能是一个带有附加属性的简单textarea元素。

我建议观看此视频，以清楚地掌握指令的概念。 http://www.youtube.com/watch?v=xoIHkM4KpHM

AngularJS：仅当元素是textarea时才应用指令

3 个答案: