Validation Message Filter Search Angular

Я хочу отобразить сообщение, если в моем списке не найдено ни одного элемента. И если элемент найден, сообщение больше не отображается. Как я буду это делать? Вот мой пример: plnkr Validation Message Filter Search Angular

<body ng-app="MyApp"> 
 
    <div ng-controller="MyCtrl"> 
 

 
     <h3>Filter by String</h3> 
 
     <form class="form-inline"> 
 
     <input ng-model="match.name" type="text" placeholder="Filter by name" autofocus> 
 
     </form> 
 
     <ul ng-repeat="friend in friends | exact: match | orderBy: 'name' "> 
 
     <li>{{friend.name}} ({{friend.age}})</li> 
 
     </ul> 
 

 
    <div>pas d'élement trouvé dans la liste</div> 
 

 
    </div> 
 

 
    </body>

Я хочу, чтобы показать "па d'ЭЛЕМЕНТ Trouvé ...", если 0 находится в моем списке

код

Контроллер:

var app = angular.module("MyApp", []); 
 

 
app.controller("MyCtrl", function($scope) { 
 
    $scope.friends = [ 
 
    { name: "Peter", age: 20 }, 
 
    { name: "Pablo", age: 55 }, 
 
    { name: "Linda", age: 20 }, 
 
    { name: "Marta", age: 37 }, 
 
    { name: "Othello", age: 20 }, 
 
    { name: "Markus", age: 32 } 
 
    ]; 
 

 
    $scope.filterFunction = function(element) { 
 
    return element.name.match(/^Ma/) ? true : false; 
 
    }; 
 

 
}) 
 

 
app.filter('exact', function(){ 
 
    return function(items, match){ 
 
    var matching = [], matches, falsely = true; 
 
    
 
    // Return the items unchanged if all filtering attributes are falsy 
 
    angular.forEach(match, function(value, key){ 
 
     falsely = falsely && !value; 
 
    }); 
 
    if(falsely){ 
 
     return items; 
 
    } 
 
    
 
    angular.forEach(items, function(item){ // e.g. { title: "ball" } 
 
     matches = true; 
 
     angular.forEach(match, function(value, key){ // e.g. 'all', 'title' 
 
     if(!!value){ // do not compare if value is empty 
 
      matches = matches && (item[key] === value); 
 
     } 
 
     }); 
 
     if(matches){ 
 
     matching.push(item); 
 
     } 
 
    }); 
 
    return matching; 
 
    } 
 
});

благодарит

источник

2015-11-25 ALFA

Можете ли вы вставить свой код контроллера здесь? – Chandan

Код контроллера в моем измененном вопросе. Код завершен: http://plnkr.co/edit/xvY0unv344BEP7rR12TZ?p=preview – ALFA

см. Мой ответ ниже – Chandan

Plunker

Вы можете сохранить отфильтрованный список любой переменной и проверить эту переменную, чтобы увидеть, есть ли там какой-либо список доступен после фильтрации.

<ul ng-repeat="friend in (result = (friends | exact: match | orderBy: 'name')) "> 
     <li>{{friend.name}} ({{friend.age}})</li> 
</ul> 
<p ng-show="result.length == 0"> Not Found </p>

источник

2015-11-25 05:58:50

Он работает, спасибо. :) – ALFA

Почему он не работает, если я ищу фильтр по математике: plnkr.co/edit/azo7v0EiW889MdYv86fg?p=preview – ALFA

@ALFA 'http://plnkr.co/edit/91VJf8vgjEeTCcphDSsb? p = preview' –

Вы можете определить переменную в контроллере как $scope.isListPresent = $scope.friends.length > 0; и на основе этой переменной можно поставить ng-if на ваше сообщение div, как показано ниже -

<div ng-show="!isListPresent">pas d'élement trouvé dans la liste</div>

Это должно решить вашу проблему.

источник

2015-11-25 05:52:46 Chandan

он не работает !!! вы можете показать мне результат с моим кодом plnkr? – ALFA

Если это работает, он может просто использовать ng-if = "friends.length == 0" – Arg0n

Кстати, он должен быть $ scope.friends.length в контроллере – Arg0n

Validation Message Filter Search Angular

ответ

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