Búsqueda no disponible con angularJS

[jc1992]

Buenos días !

He estado investigando con AngularJS y Laravel , he progesado bastante , tengo hecho un CRUD y mi intención ahora es cuando en el type="text" realizo una búsqueda salga "La búsqueda no existe"

Me explicaé mejor a ver.

Tengo una tabla que listan los datos y tengo activado el filtro search.

Código HTML:

<input type="text" ng-model="search.nombre" class="search-query" placeholder="Search">
 

Y la tabla digamos que es la siguiente.

Código HTML:

<table class="table">
  <thead>
  <tr>
    <th><a href="" ng-click="predicate = 'nombre'; reverse=!reverse">Nombre</a></th>
    <th><a href="" ng-click="predicate = 'path'; reverse=!reverse">Path</a></th>
    <th><a href="#/new"><i class="fa fa-plus-square-o"></i></a></th>
  </tr>
  </thead>
  <tbody>
 
  <tr ng-repeat="node in nodes | filter:search | orderBy:predicate:reverse | pagination: curPage * pageSize | limitTo: pageSize">
    <td>{{node.nombre}}</td>
    <td>{{node.path}}</td>
    <td>
      <a href="#/new/{{node.id}}"><i class="fa fa-plus-square-o"></i></a>
      <a href="#/edit/{{node.id}}"><i class="fa fa-pencil-square-o"></i></a>
    </td>
    
  </tr>
   <span>Page {{curPage + 1}} of {{ numberOfPages() }}</span>
   primero:{{firstPage}}
   último:{{numberOfPages()}}
  <a class="btn btn-primary" ng-disabled="curPage == 0"
 ng-click="curPage=curPage-1"> &lt; PREV</a>
 <a class="btn btn-primary"
 ng-disabled="curPage >= nodes.length/pageSize - 1"
 ng-click="curPage = curPage+1">NEXT &gt;</a>
 
 <a class="btn btn-primary" ng-click="numberOfPages()">LAST</a>
 
</table>
 

Vale , pues la idea es que cuando busque un nombre y este no exista me diga que la búsqueda no es exitosa.

[stock]

Puedes usar la directiva ng-if, para cuando el arreglo de nodes sea igual a cero desplegar el mensaje que necesites ;)

Código HTML:

...
 
<tr ng-if="nodes.length == 0">
   <!-- aquí tu mensaje que quieras -->
</tr>
 
<tr ng-repeat="node in nodes | filter:search | orderBy:predicate:reverse | pagination: curPage * pageSize | limitTo: pageSize">
    <td>{{node.nombre}}</td>
    <td>{{node.path}}</td>
    <td>
      <a href="#/new/{{node.id}}"><i class="fa fa-plus-square-o"></i></a>
      <a href="#/edit/{{node.id}}"><i class="fa fa-pencil-square-o"></i></a>
    </td>
    
  </tr>
 
...
 

Saludos