angularjs: $ filter no está definido al intentar obtener datos filtrados

Question

May 23, 2013, 08:00 AM

angularjs: $ filter no está definido al intentar obtener datos filtrados

Desde los días que estoy tratando de poner esto en funcionamiento: con el siguiente fragmento de código quiero filtrar algunas personas y, después de que se haya activado onchange, reciba los objetos que se han filtrado. Vea este Código en vivo aquí:http://jsbin.com/isojof/1/

¿Alguna idea?

Aún no hay un objeto de filtro $ ... pero, ¿cómo crear uno? ¡$ filter ('filtro') obviamente no funciona!

<html ng-app>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>

</head>


<body ng-controller="List">

    Search: <input ng-change="getData(names, query)" ng-model="query">
    Search: <select ng-change="getData(names, query2)" ng-model="query2">
    <option></option>
    <option>Berlin</option>
    <option>Hamburg</option>
</select>
 <div>
    <ul class="names" >
        <li ng-model="item" " ng-repeat="name in names | filter:query | filter:query2">
            {{name.firstname}}, {{name.lastname}}, {{name.age}}, {{name.location}}
        </li>
    </ul>
</div>
    <script type="text/javascript">
    function List($scope) {
        $scope.names = [
        {"firstname": "Carl",
        "lastname": "Luyk",
        "age": 20,
        "location":"Berlin"},
        {"firstname": "Carl",
        "lastname": "Moreen",
        "age": 20,
        "location":"Hamburg"},
        {"firstname": "Tom",
        "lastname": "Luyk",
        "age": 25,
        "location":"New York"},
        {"firstname": "Caren",
        "lastname": "Tilt",
        "age": 20,
    "location":"Paris"},
        {"firstname": "Caren",
        "lastname": "Orail",
        "age": 30,
        "location":"Hamburg"},
        ];
$scope.getData = function (names, query) {
  $scope.queryData = $filter('filter')(names, query);
  console.log($scope.queryData);
};



    }
    </script>

</body>
</html>