如何正确选择指令中的元素？答案

【问题标题】：How to properly select an element inside a directive?如何正确选择指令中的元素？
【发布时间】：2016-08-06 14:27:26
【问题描述】：

如果我为我的 angular 指令定义一个 link 函数，那么在指令中选择特定元素的最佳方法是什么？例如，如果这是我的模板网址：

<div>
  <form>
    <input></input>
  </form>
</div>

并且我想选择input，在我的链接函数中获取对input 标记的引用的最佳方法是什么？

我最初的想法是在input 标签上放置一个id 属性并根据它进行选择，但由于这是一个指令，我不一定知道它在哪里使用，所以我选择的任何 id 都可能不是唯一的.

【问题讨论】：

我相信最好的方法是为指令创建一个属性并将其动态关联到您想要的控件。这样您就可以始终了解您正在处理的领域。
@HugoS.Mendes 如果我理解正确，我认为这不是一个好主意。这是一个内部实现细节，不应该关心指令的用户。使用它的人不会在意选择什么内部元素或如何选择。
嗯.. 有道理：o

标签： javascript jquery angularjs jquery-selectors angular-directive

【解决方案1】：

最好的方法是使用angular元素对象，它内置了jqlite函数，对于非唯一元素或jQlite不支持的东西，你总是可以得到纯DOM并使用querySelector ej：

app.directive("directiveName",function()
{
   return{
     template : "<div><span class='aclass'><button>hi</button></span></div>",
     link ( scope, ele, attr){
       var a = ele.find('button');
       console.log(a);
       var b= ele[0].querySelector('.aclass')  //element[0] for the DOM
       console.log(b);
     }
   };
});

这里是您可以与元素对象一起使用的 jqlite 函数列表 https://docs.angularjs.org/api/ng/function/angular.element

【讨论】：