按作為屬性的對象的屬性過濾

Question

我有一組對象設置如下：

$scope.people = [{name:
                  {last:"Doe", first:"John"}},
                 {name:
                  {last:"Smith", first:"Joe"}}];

我正在嘗試按姓氏文本框進行實時過濾。

這是jsfiddle： http : //jsfiddle.net/HB7LU/4287/

你能幫忙的話，我會很高興。 謝謝！

編輯：抱歉我輸入了錯誤的jsfiddle

Answer 1

以您的小提琴為起點，我會說：

HTML

<div ng-controller="MyCtrl">    
  <input ng-model="search" ng-init="search = ''" placeholder="enter search" />
  <div ng-repeat="person in people | filter:{name.last: search}">
    {{ person | json }}
  </div>
</div>

JS

var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
    $scope.people = [{ name: { last: 'Doe', first: 'John' } },
                     { name: { last: 'Smith', first: 'Joe' } }];

}

這是pl人http://plnkr.co/edit/W46Fkj

Answer 2

因此，創建一個過濾器！

構建現有代碼：

myApp.filter("search", function() {
    return function(people, startPhrase) {
        if(!startPhrase) {
            return people;   
        }
        var filtered = [];
        for(obj in people) {
            if(people[obj].name.last.indexOf(startPhrase) == 0) {
                filtered.push(people[obj]);
            }
        }
        console.log(filtered);
        return filtered;
    }
});

現在，您可以在HTML的任何位置使用稱為“搜索”的過濾器。 這樣稱呼它：

<div ng-controller="MyCtrl">
    <input ng-model="search.name.last"/>
    <div ng-repeat="person in people | search:search.name.last">
        {{person.name.last}}, {{person.name.first}}
    </div>
</div>