Angular js表格过滤器不适用于嵌套对象

Question

我有一个对象数组，比如 -

$scope.objs = [
    {
        'name': 'test',
        'id': '1',
        'config': {
            'processID': 3,
            'hName': 'host'
        }  
    },
    {
        'name': 'test2',
        'id': '12',
        'config': {
            'processID': 32,
            'hName': 'host2'
        }
    }
 ];

我有一个表格表示，我想在每一列上添加过滤器--

<table>
    <thead>
       <tr>
            <th>
                Name                                    
                <span class="dropdown" dropdown on-toggle="toggled(open)">
                    <a href class="dropdown-toggle" dropdown-toggle>
                        <i title="filter" class="operation fa fa-filter"></i>
                    </a>
                    <ul id="filterPopup" class="dropdown-menu">
                        <li><input ng-model="search.name"  type="text" placeholder="filter by Name"/></li>
                    </ul>
                </span>
            </th>
            <th>
                ID
                <span class="dropdown" dropdown on-toggle="toggled(open)">
                    <a href class="dropdown-toggle" dropdown-toggle>
                        <i title="filter" class="operation fa fa-filter"></i>
                    </a>
                    <ul id="filterPopup" class="dropdown-menu">
                        <li><input ng-model="search.id" type="text" placeholder="filter by ID"/></li>
                    </ul>
                </span>
            </th>
            <th>
                ProcessID
                <span class="dropdown" dropdown on-toggle="toggled(open)">
                    <a href class="dropdown-toggle" dropdown-toggle>
                        <i title="filter" class="operation fa fa-filter"></i>
                    </a>
                    <ul id="filterPopup" class="dropdown-menu">
                        <li><input ng-model="search.config.processID"  type="text" placeholder="filter by pId"/></li>
                    </ul>
                </span>
            </th>
            <th>
                ProcessID
                <span class="dropdown" dropdown on-toggle="toggled(open)">
                    <a href class="dropdown-toggle" dropdown-toggle>
                        <i title="filter" class="operation fa fa-filter"></i>
                    </a>
                    <ul id="filterPopup" class="dropdown-menu">
                        <li><input ng-model="search.config.hname"  type="text" placeholder="filter by hname"/></li>
                    </ul>
                </span>
            </th>

       </tr>                           
    </thead>
    <tbody>
        <tr ng-repeat="obj in objs | filter:search">  
            <td>
                {{obj.name}}
            </td>
            <td>
                {{obj.id}}
            </td>
            <td>
                {{obj.config.processID}}
            </td>
            <td>
                {{obj.config.hName}}
            </td>                       
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td colspan="7">- END OF DATA -</td>
        </tr>
    </tfoot>
</table>

它适用于 name 和 ID ，但对于像 - config.hname 和 config.processID 这样的嵌套对象会产生一些奇怪的行为。对他们来说，它第一次起作用，之后就不起作用了。

对此有什么想法吗？

Answer 1

嗯，AngularJS 过滤器仅适用于 arrays（在您的情况下为对象数组。）而不适用于对象。参考这个question