搜索过滤器不工作。 Angular 杰斯

Question

大家好，我的搜索过滤器出于某种原因无法正常工作。您可以在 this website! Like i dont understand why its wrong. I followed the tutorial exactly from this 网站上查看。请帮忙！

这是我的代码：

index.html:

<!DOCTYPE html>
<html lang= "en">

<head>
    <meta charset="UTF-8" />
    <title>Basic Login Form</title>
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
    <script src = "https://rawgit.com/nirus/Angular-Route-Injector/master/dist/routeInjector.js"></script>
    <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-route.js"></script>
    <script type="text/javascript" src="main.js"></script>
</head>

<body ng-app = "app">

<div ng-controller = "people">
    <ul>
        <h2>Names And Ages of Programmers:</h2>
          <li ng-repeat = "person in persons | filter: searchBox">
            Name: {{person.Name}}<br>
            Age: {{person.Age}}<br>
            Favorite-Color : {{person.Fav_Color}}
          </li>

    </ul>
</div>
    <div id = "searchBoxes">
      Global Search Filter : "  <input type="text" ng-model="globalSearch.$"><br>
      Name Search Filter:   <input type="text" ng-model = "globalSearch.Name"><br>
      Age Search Filter:  <input type="text" ng-model = "globalSearch.Age"><br>
      Favorite Color Search Filter:  <input type="text" ng-model = "globalSearch.Fav_Color"><br>
    </div>
  </div>
</body>
</html>

main.js:

var filex = {
    "records" : [
        {
            "Name":"Something",
              "Age":"18",
              "Fav_Color" : "Orange"
        },
        {
            "Name": "Anonymus",
            "Age" : "???",
            "Fav_Color" : "Blue"
        }


    ]
}


var app = angular.module('app',[])

app.controller('people', function($scope){
      $scope.persons = filex.records
    })

Answer 1

您错过了过滤器绑定的输入：

<input type="text" ng-model="searchBox">

添加这个很重要，因为这里的 ng-model="searchBox" 绑定到你的搜索结果：<li ng-repeat = "person in persons | filter: searchBox"> 这里。

您的搜索结果是根据型号 searchBox 过滤的。

JsBin example

搜索过滤器不工作。 Angular 杰斯

Search Filters Not working. Angular Js

javascript

angularjs

filter

global-filter