角度过滤器混淆

Question

所以我的 Firebase 中有一个用户列表。现在我向每个用户展示这样的：

<input type="text" ng-model="search.username" placeholder="{{ 'SEARCH_USERS' | translate}}" class="form-control"> <br/>
<ul>
    <li ng-repeat="user in users | usernameFilter:search.username ">
        <a href="#/report/{{user.username}}">{{user.username}}: {{user.firstname}} {{user.lastname}}</a> <br/>
    </li>
</ul>
<p ng-show="error" >{{error}}</p>

Search.username 或 search 没有区别，过滤器什么也不做。这是我的用户参考的样子：

Object {$id: "users", $bind: function, $add: function, $save: function, $set: function…}
$add: function (item) {
$auth: function (token) {
$bind: function (scope, name, defaultFn) {
$child: function (key) {
$getIndex: function () {
$getRef: function () {
$id: "users"
$off: function (type, callback) {
$on: function (type, callback) {
$remove: function (key) {
$save: function (key) {
$set: function (newValue) {
$transaction: function (updateFn, applyLocally) {
$update: function (newValue) {
Battle: Object
Litchy: Object
Robin: Object
__proto__: Object

Battle、Litchy 和 Robin 都是用户。我想知道如何按用户名过滤此列表，AngularJS 文档示例中的简单方法似乎在这里不起作用，因为我的参考资料中没有明确的用户名属性。

编辑：Firebase 结构截图：

Answer 1

@ExpertSystem 对 Angular 的过滤方法的工作原理提供了一些深刻的见解。您还可以使用orderByPriority 将您的 $firebase 对象转换为有序数组，这与 Angular 的过滤器工具一起使用会更简单一些：

<li ng-repeat="user in users | orderByPriority | usernameFilter:search.username ">
    <a href="#/report/{{user.username}}">{{user.username}}: {{user.firstname}} {{user.lastname}}</a> <br/>
</li>

另请注意，在即将发布的 AngularFire 版本中，orderByPriority 可能会被一些更高级的数组工具 ($asArray) 取代。

Answer 2

如果我理解正确，您想“按键”过滤。
Angular的filter过滤器过滤了被迭代对象的“值”，但是你可以使用自定义过滤器来按键过滤：

<div ng-repeat="user in users | byKey:search.username">

app.filter('byKey', function () {
    return function (obj, username) {
        if (!username) { return obj; }
        username = username.toLowerCase();

        var filtered = {};
        angular.forEach(obj, function (value, key) {
            if (key.toLowerCase().indexOf(username) !== -1) {
                filtered[key] = value;
            }
        });
        return filtered;
    };
});

_{注意： 我已经实现了过滤器来执行不区分大小写的子字符串匹配。
您应该根据您的要求对其进行修改。}

另请参阅此short demo。