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

How to properly select an element inside a directive?

本文关键字：元素 指令 何正确 选择      更新时间：2023-09-26

如果我为我的角度指令定义了一个link函数，那么在指令中选择特定元素的最佳方式是什么？例如，如果这是我的模板url:

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

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

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

最好的方法是使用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

相关文章：