Zeige Nachricht, wenn die Ergebnisse leer sind

Question

Ich habe ein Suchformular für Produkte. Ich möchte sicherstellen, dass es mir eine Nachricht zeigt, wenn die Liste leer ist, wenn es kein Ergebnis gibt.

Mein Code:

<form ng-controller="productCtrl" name="searchForm" ng-submit="searchProduct()" ng-disabled="searchForm.$invalid"> 
    <input placeholder="Search" type="text" ng-model="form.name" required> 
    <ion-list> 
    <ion-item ng-repeat="product in list track by $index">{{ product.name }}</ion-item> 
    </ion-list> 
</form> 

danke :)

Answer 1

Sie können ng-wenn über die ng-repeat

Like this

<div ng-if="list.length<=0" style="color:red;">Error!</div> 

Ex:

<div ng-app="app"> 
    <div ng-controller="TodoCtrl"> 
    <div ng-if="todos.length<=0" style="color:red;">Error!</div> 
    <div ng-repeat="item in todos">{{item.color}}</div> 
    </div> 
</div> 

https://jsfiddle.net/vqJ5q/48/

Answer 2

ist Es gibt viele verschiedene Antworten, wie:

1. Verwenden * ng-if ** oder ng-Show in einem anderen Element, das leeren Zustand anzeigen Botschaft. Überprüfen Sie die Länge der angezeigten Liste. Wenn list.length <= 0 diesen Fehler anzeigen.

2. Bedingung hinzufügen zu mit ng-wenn oder ng-verstecken in ng-wenn Elemente. Wenn list.length <=0.

3. Oder Sie können Boolesche Flag in Ihrem Umfang Objekt erstellen, wie isShowEmptyState = false und nur true gesetzt, wenn die Liste leer war