2015-09-11 2 views
3

Я использую pretty nice plugin, который обеспечивает теги входные директивы для AngularJS.Угловые метки директивы выпуск

Я использую параметр onTagAdding, чтобы проверить значение тега, прежде чем он будет добавлен к вводу.

on-tag-adding="{expression}" 

Так что, как документация говорит:

Выражение для оценки, которая будет вызываться перед добавлением нового тега. Новый тег доступен как $ tag. Этот метод должен возвращать true или false. Если false, тег не будет добавлен.

Так вот live example.

$scope.checkTag = function(tag) { 
    angular.forEach($scope.forbiddenTags, function(e){ 
     if (e.text === tag.text) { 
      alert('Tag is forbidden') 
      return false; 
     } 
    }) 

    alert('Execution is continuing'); 
} 

Я ожидаю, что если введенное значение соответствует одному для этих тегов из $scope.forbiddenTags массива, то ложных должны быть возвращены и исполнение функции должно быть остановлено, но это работает не так, как я жду =). Я пробовал только с return, но он тоже не работает.

Любая помощь и предложения будут оценены! Заранее спасибо!

ответ

3

Проблема в том, что возврат из функции forEach iterator бесполезен, она в конечном итоге не вернет это возвращаемое значение из внешней функции checkTag, как вы ожидали. Вы можете попробовать что-то вроде этого.

$scope.checkTag = function(tag) { 
var found = $scope.forbiddenTags.some(function(ftag){ 
    if (ftag.text === tag.text) { 
     alert('Tag is forbidden'); 
     return true; 
    } 
    //If you do not need alert then just do 
    // return (ftag.text === tag.text); 
}); 
return !found; 
} 

Я использую array.some (проверьте прокладку, если необходимо поддерживать IE < 9) здесь, так что я выйти из цикла через один раз совпадение найдено (чтобы избежать ненужных итераций, которые вы не можете сделать с forEach) возвращая логическое значение. Вместо этого вы можете использовать традиционный цикл for как и для использования. Если вы хотите по-прежнему использовать forEach, тогда сохраните логический флаг, он будет найден и выведет его за пределы.

$scope.checkTag = function(tag) { 
    var found = false; 
    angular.forEach($scope.forbiddenTags, function(e){ 
     if (e.text === tag.text) { 
      alert('Tag is forbidden') 
      found = true; 
      //A return here is of no use as it will not break out of the loop 
     } 
    }); 

    alert('Execution is continuing'); 
    return !found; //If found is true then return false and vice versa 
} 
+0

Прохладный! Он работает как шарм =) Спасибо за ответ и хорошее объяснение! – user3673623

+1

@ user3673623 Добро пожаловать. :) Примечание. - Вы также можете использовать [Array.find] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find), [Array.findIndex] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex) с поддержкой Shim, но 'array.some' будет более точным для этого. – PSL

+1

@PSL Хорошее объяснение относительно IE> поддержка 9 :) –

Смежные вопросы