AngularJS: как избежать этого поведения, когда data.length находится на нуле?

Question

У меня есть предупреждение, которое отображается пользователю, когда массив с именем lineItemsF.length находится на ноле. Я работаю над одностраничным приложением, поэтому, как только пользователь войдет в этот массив, он будет на нуле, через пару секунд данные загрузятся, так что массив будет иметь некоторые элементы, поэтому предупреждение исчезнет.

Это предупреждение - это то, что я использую в фильтре, в этом случае в окне поиска, когда пользователь вводит что-то в этом окне поиска, а фильтр ничего не возвращает, появляется предупреждение.

Я сделал видео для вас, чтобы понять, что происходит, просто взгляните на красный баннер в верхней части экрана, который автоматически удаляется после загрузки данных. Это не то, что я хочу, все, что я хочу, - это увидеть это предупреждение, как только пользователь напечатает что-то неправильно в окне поиска.

У меня есть то, что с использованием $pristine или $dirty будет работать, но я не знаю, использовал ли я эти атрибуты неправильно.

<!--this is the alert--> 
<div class="alert" 
     ng-show="!lineItemsF.length">Did not match any search criteria 
</div> 
<!--this is the alert--> 

    <div ng-repeat="lineItem in lineItemsF = (lineItems | filter:search)"> 

     <div class="panel"> 
     <div class="panel-heading"> 
      <h3 class="panel-title">{{:: lineLeague[0].leagueName}}</h3> 
     </div> 
     <div class="panel-body"> 
      <table class="table table-bordered tables"> 
      <thead class="tableHeader"> 
      <tr> 
       ... 
      </tr> 
      </thead> 

какие-либо предложения?

Answer 1

Просто поместите это в ваших условиях оповещения

<div class="alert" 
     ng-show="searchCriteria.length > 0 && !lineItemsF.length">Did not match any search criteria 
</div> 

searchCriteria это значение внутри поля поиска, поэтому он будет отображаться только в случае, если критерием является не null (или длина> 0).

Answer 2

Использование ng-cloak в вашем DIV или ng-show="lineItemsF.length!=0"