2013-05-15 82 views
0

我有一个属于一个独特团队的球员列表。我会想创建一个触发了按钮过滤由2队制造联盟列表列表即Angularjs筛选联盟列表

"Players": [ 
    { 
    "Name": "Aron Baynes", 
    "TeamName": "San Antonio Spurs", 
    "TeamID": "4fd03d4e1c73bc0a74b81f24", 
    }, 
    { 
    "Name": "Michael Jordan", 
    "TeamName": "Chicago Bulls", 
    "TeamID": "4fd03d4e1c73bc0a74b81f18", 
    }, 
    { 
    "Name": "Tim Duncan", 
    "TeamName": "Los Angeles Lakers", 
    "TeamID": "4fd03d4e1c73bc0a74b81f11", 
    }, 
    { 
    "Name": "Stephen Jackson", 
    "TeamName": "Miami Heat", 
    "TeamID": "4fd03d4e1c73bc0a74b81f15", 
    }] 

我在新的角度,所以我想出了4种方法在网上搜索过滤但既不是那些工作的东西是在我的HTML我有一个按钮与游戏可以说,芝加哥@迈阿密当你按下它应该只过滤列表2球员(乔丹和杰克逊)使用Json上面的统一列表,如在查询中获取所有拥有芝加哥队或迈阿密队的球员。我知道必须创建一个自定义过滤器,但一旦被创建,它可以如何从按钮调用并影响ng-repeat?该按钮可以提供主队和客队的信息。

回答

1

您将需要创建两个范围项目,供您的ng-repeat | filter使用。当您通过ng-click单击按钮时,您可以设置这些值,即scope值。

<ul> 
    <li ng-repeat="player in players | filter:filterFunction">{{player.Name}}</li> 
</ul> 
<button ng-click="setTeams('Chicago Bulls', 'Miami Heat')">Click</button> 
<button ng-click="setTeams('', '')">Reset</button> 


$scope.setTeams = function (homeTeam, awayTeam) { 
    $scope.homeTeam = homeTeam; 
    $scope.awayTeam = awayTeam; 
}; 
$scope.filterFunction = function (item) { 
    if ($scope.homeTeam && $scope.awayTeam) { 
     if (item.TeamName == $scope.homeTeam || item.TeamName == $scope.awayTeam) { 
      return item; 
     } 
    } else { 
     return item; 
    } 
};