2017-01-04 6 views
1

У меня есть объект, которым имеет два массива объектов, например:change.delegate очень медленно

Interests = { 
    MostInterests: [], 
    DistinctInterests: [] 
}; 

У меня также есть вход, который при изменении, использует функцию для поиска элементов в интересах. DistinctInterests, но похоже, что change.delegate = "function()" занимает много времени для запуска.

<input ref="textsearch" change.delegate="searchInterest($event.target.value)" type="text" /> 

searchInterest(value){ 
     console.log('SEARCH'); 
     this.searchedInterests = []; 
     var i = 0, j = 0;; 
     var upperValue = value.toUpperCase(); 
     for(i = 0 ; i < this.Interests.DistinctInterests.length ; i++){ 
      if(this.Interests.DistinctInterests[i].normalizedName.indexOf(upperValue) !=-1){ 
       this.searchedInterests[j] = this.Interests.DistinctInterests[i]; 
       j++; 
      } 
     } 
     console.log('END SEARCH'); 
    } 

Цель обновить представление с элементами в this.searchedInterests, который содержит элементы, которые соответствуют искомый текст.

Я не знаю, является ли это проблемой Aurelia или показателем javascript. Я попробовал aldo с функцией $ .each().

PS: список содержит 50 элементов.

+1

Использование 'input.delegate'? – nicovank

+0

Является ли 'console.log' слишком длинным для показа? –

+0

@nicovank, вы решили мою проблему, спасибо. Я не знал 'input.delegate'. Он работает нормально. –

ответ

2

change событие только уволено when a change to the element's value is committed by the user.

Придумайте совершил в CTRL+Z шаги


Это причина, ваша функция занимает больше времени, чтобы выполнить: он просто не был вызван.

Вместо этого, используя событие input, ваша функция будет вызываться каждый раз при изменении значения.

<input ref="textsearch" input.delegate="searchInterest($event.target.value)" type="text" />