Ionic应用中的angularJS过滤问题

angularJS filtring issue in Ionic app

本文关键字:过滤 问题 angularJS 应用 Ionic      更新时间:2023-09-26

我正在使用Ionic框架开发一个简单的产品过滤应用程序。我有一个想要过滤的产品列表,AngularJS过滤器模型工作得很好,除了这个奇怪的情况:如果我向下滚动列表和过滤器,大多数搜索查询都会丢失。

https://apps.ionic.io/app/11bc2ed5

.factory('Recettes', function() {
  // Might use a resource here that returns a JSON array
  var data = [];
  data.recettes = [];
  data.produits = [
    
    {
      "index": 1,
      "isActive": true,
      "estAutorise": 0,
      "name": "Howard Price",
      "marque": "in"
    },
    {
      "index": 2,
      "isActive": true,
      "estAutorise": 1,
      "name": "Ingrid Saunders",
      "marque": "amet"
    },
...
<ion-view view-title="Dashboard">
  <ion-header-bar class="item-input-inset">
    <label class="item-input-wrapper">
      <i class="icon ion-ios-search placeholder-icon"></i>
      <input type="search" placeholder="Rechercher Un Produit" ng-model="searchText">
    </label>
    <button class="button button-clear" ng-click="searchText = undefined">
      Annuler
    </button>
  </ion-header-bar>
  <ion-content class="padding" >
    
    <div  class="list card" ng-repeat="produit in produits  | filter:searchText | orderBy: index">
      <div ng-switch on="{{produit.estAutorise}}">
        <div class="item item-autorise" ng-switch-when="1">
              <h2 class="title"><b>{{produit.marque}} </b>{{produit.name}}</h2>
              <b class="balanced">Autorisé</b>   
      ....

这里有几张图片可以描述这个问题:

https://i.stack.imgur.com/DpwuQ.png

[第二张图片],我在页面顶部输入搜索,一切都很好。

[第一张图片][第三张图片]然而,当我向下滚动列表并插入相同的查询时,没有显示。

我真的很感激你的帮助,谢谢!

原来的过滤器是工作的,在视图中的问题,当我向下滚动,然后过滤屏幕的那一部分变成空,视图留在那里,即使没有什么显示在那里。我希望有calToTop函数,当查询刷新时自动移动到顶部