Как проверить, существует ли элемент с идентификатором в AngularJS

#javascript #angularjs #jqlite

#javascript #angularjs #jqlite

Вопрос:

Как я могу проверить, существует ли элемент с определенным идентификатором уже в моем DOM внутри директивы Angular? С помощью angular.element() элемента создается, если он не существует, например angular.element('someID') , возвращает элемент, независимо от того, существует он уже или нет.

То, что я делаю сейчас в качестве обходного пути, — это использование .html() функции jqLite следующим образом:

if(angular.element(‘#someElementID’).html()) {

console.log(‘срабатывает только в том случае, если элемент уже существует’);

}

Есть ли лучший способ сделать это? Я бы хотел избежать включения всего jQuery только для этого.

Комментарии:

1. Вы пробовали angular.element($document).find(‘#someElementID’) ?

2. Нет, но я сделал это сейчас. Тот же результат, создает объект.

3. Я только что попробовал это в консоли, оба angular.element($document).find(‘#someElementID’) и angular.element(‘#someElementID’) возвращают пустой массив. Вы должны быть в безопасности, выполняя следующее: if ( angular.element(‘#someElementID’).length ) { console.log(‘#someElementID существует’); }

4. Правда, это массив, спасибо, что указали на это. Не стесняйтесь публиковать ответ, иначе я сделаю это позже, чтобы закрыть вопрос.

5. Документация Angular (которую, кстати, я нахожу довольно плохой) добавила мне путаницы, поскольку в ней упоминается, что angular.element() возвращает объект jQuery, а не массив: docs.angularjs.org/api/ng/function/angular.element

Ответ №1:

Оба angular.element($document).find(‘#someElementID’) и angular.element(‘#someElementID’) возвращают пустой массив в случае, если несколько узлов dom соответствуют селектору.

Вы должны быть в безопасности, выполняя следующее:

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

Также имейте в виду, что метод jqLite .find() поддерживает только имена тегов.

Комментарии:

1. Не могли бы вы добавить пример с реальными данными? Это потому, что я не знаю, как «angula.element» связан с моим кодом.

Ответ №2:

Я протестировал, он работает нормально..

Если идентификатор существует, он возвращает 1

Идентификатор не существует, он возвращает 0

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