Question

我有一个简单的ng-repeat。可以通过两种方式填充ng-reapeat，首先输入一个值并单击“提交”按钮，然后输入值，列表会自动更新。

我发现的问题是，当用户点击Sumbit时，使用过滤器的ng-repeat不会更新。

Heres a plunker（类型帮助）：http://plnkr.co/edit/1qR6CucQdsGqYnVvk70A?p=preview

HTML：

<div id="fixed" directive-when-scrolled="loadMore()">
  <ul>
    <li ng-repeat="i in items | limitTo: limit | filter: search">{{ i.Title }}</li>
  </ul>
</div>

<br>


<input ng-model="searchText">
<button ng-click="performSearch(searchText)">Submit</button>


<div>
  <strong>Result Search onClick</strong>
  <ul>
    <li ng-repeat="item in filtered">
      <p>{{ item.Title }}</p>
    </li>
  </ul>
</div>

JS：

app.controller('MainCtrl', function($scope, $filter) {  

$scope.limit = 5;

  var counter = 0;
  $scope.loadMore = function() {
    $scope.limit += 5;
  };

  $scope.loadMore();

  $scope.performSearch = function(searchText) {
        $scope.filtered = $filter('filter')($scope.items, $scope.search);
    }

    $scope.search = function (item){
        if (!$scope.searchText)
            return true;

        if (item.Title.indexOf($scope.searchText)!=-1 || item.Title.indexOf($scope.searchText)!=-1) {
                return true;
            }
            return false;
    };


});


app.directive("directiveWhenScrolled", function() {
  return function(scope, elm, attr) {
    var raw = elm[0];

    elm.bind('scroll', function() {
      if (raw.scrollTop + raw.offsetHeight >= raw.scrollHeight) {
        scope.$apply(attr.directiveWhenScrolled);
      }
    });
  };
});

我有什么想法可以使用机器人在点击时更新的单个ng-repeat和用户输入值？

Answer 1

您传递给过滤器的型号名称

它＆＃39; S

<li ng-repeat="i in items | limitTo: limit | filter: search">{{ i.Title }}</li>

应为

<li ng-repeat="i in items | limitTo: limit | filter: searchText">{{ i.Title }}</li>

AngularJS - 使用自定义过滤器和ng单击以更新相同的ng-repeat

1 个答案:

它＆＃39; S

应为