ionic1 angular js ng-repeat |过滤器:搜索不工作?

时间:2017-09-25 09:48:53

标签: angularjs ionic-framework angularjs-scope angularjs-ng-repeat angularjs-filter

angular.module('starter.services', [])

 .factory('Chats', function($http) {
  // Might use a resource here that returns a JSON array

  // Some fake testing data
  var chats=[];
 $http({
  method: 'GET',
  url: 'js/champions.json'
}).then(function success(data) {
  for (var i = 1; i < 700; i++) {
    if (data.data.data[i]!=undefined) {
       chats.push(data.data.data[i]) ;
    //console.log(data.data.data[i]);
    }
  }
 });
//console.log(chats);
  return {
    all: function() {
      return chats;
    },

    remove: function(chat) {
      chats.splice(chats.indexOf(chat), 1);
    },
 
    get: function(chatId) {
      for (var i = 0; i < chats.length; i++) {
        if (chats[i].id === parseInt(chatId)) {
          return chats[i];
        }
      }
      return null;
    }
  };
}) ;
<ion-view view-title=" Tüm Kahramanlar">
  <ion-content>
    <ion-list>

  <ion-item>
    <ion-label fixed>Arama</ion-label>
    <input type="text" style="width: 100%" placeholder="Karakter Adına Göre Filtrele" ng-model="search" ></input>
  </ion-item>

</ion-list>
    <ion-list>
      <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="chat in chats  | orderBy : 'key' | filter :  search  "  type="item-text-wrap" href="#/tab/chats/{{chat.id}}">
        <img ng-src="http://ddragon.leagueoflegends.com/cdn/7.18.1/img/champion/{{chat.image.full}}">
        <h2>{{chat.name  }}</h2>
        <p>{{chat.title}}</p>
        <i class="icon ion-chevron-right icon-accessory"></i>

        <ion-option-button class="button-assertive" ng-click="remove(chat)">
          Delete
        </ion-option-button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

伙计们,怎么能过滤这个重复的代码呢,就像什么都没发生一样。所以它没有过滤。请帮助我:(我认为它的模型认为没有改变当我写|过滤器:'NameSomething'它的工作,但不能进入那里的模型怎么能这样做:?

its my output.

1 个答案:

答案 0 :(得分:0)

试试这样:

更改此行:(确保在控制器中定义$scope.search = {};

<input type="text" style="width: 100%" placeholder="Karakter Adına Göre Filtrele" ng-model="search.name" ></input>

简单实施: 搜索姓名:

<input type="text" ng-model="searchData.name">
<div ng-repeat="chat in chats | filter:searchData"> {{chat.name}}</div>

工作演示:

https://plnkr.co/edit/t6B6fZDRCSLuBN36GLVD?p=preview