如何在AngularJS中检查元素ID是否存在

Question

如何在Angular指令中检查特定ID的元素是否已存在于DOM中？使用angular.element()函数，如果不存在，则会创建一个元素，例如angular.element('someID')无论元素是否已存在，都会返回一个元素。

目前我正在使用以下方法作为解决方法，使用.html() jqLite函数来实现:

if(angular.element('#someElementID').html()) {

console.log('仅当元素已经存在时才触发');

}

是否有更好的方法来做到这一点？我想避免仅因此而包含整个jQuery。

- Dimitris

---

你尝试过使用angular.element($document).find('#someElementID')吗？ - DrDyne

不，但我现在已经创建了一个对象。相同的结果，创建一个对象。 - Dimitris

我刚在控制台中尝试了一下，无论是angular.element($document).find('#someElementID')还是angular.element('#someElementID')都返回一个空数组。 你可以放心地执行以下操作： 如果 ( angular.element('#someElementID').length ) { console.log('#someElementID 存在'); } - DrDyne

没错，这是一个数组，谢谢你指出来。如果你愿意，随时可以发表答案，否则我稍后会回答并关闭问题。 - Dimitris

Angular文档（顺便说一句，我觉得相当糟糕）增加了我的困惑，因为它提到angular.element()返回一个jQuery对象而不是一个数组：https://docs.angularjs.org/api/ng/function/angular.element - Dimitris

Answer 1

angular.element($document[0].querySelector('#someElementID')) 和 angular.element(document.querySelector('#someElementID')) 会返回第一个匹配选择器的节点，而不是一个空数组。

建议使用以下代码：

if ( angular.element('#someElementID').length ) {
    console.log('#someElementID exists');
}

请记住，jQLite .find() 方法只支持标签名称。

- DrDyne

---

请您能否添加一个真实数据的示例？因为我不知道"angula.element"与我的代码有什么关系。 - Julian Moreno

Answer 2

我已经测试过了，它运行得很好。

如果ID存在，则返回1

ID不存在，则返回0

if(angular.element('#someElementID').length >0){
 console.log("Id is available.");
}else{
  console.log("Id is not available.");
}

- Dinesh Vaitage