傳遞函數作爲AngularJS中的選擇值

我有一個電影列表，我想通過下拉列表中的選項進行排序。我正在使用自定義函數進行排序以排除非數字選項。它直接傳遞函數時工作正常，但我不知道如何將該函數作爲下拉中的值傳遞。傳遞函數作爲AngularJS中的選擇值

<select name="sort" id="" ng-model="filters"> 
     <option value="sortByRtRating">Rotten Tomatoes rating</option> 
     <option value="sortByImdbRating">IMDB rating</option> 
    </select> 

<div ng-repeat="movie in movieList | toArray | orderBy:filters.sort:true">

$scope.sortByRtRating = function(item) { 
    if (!item.details) return -1; 
    if (typeof item.details.rt.rating != 'number') 
    return -1; 
    return item.details.rt.rating; 
} 

$scope.sortByImdbRating = function(item) { 
    if (!item.details) return -1; 
    if (typeof item.details.imdb.rating != 'number') 
    return -1; 
    return item.details.imdb.rating; 
}

來源

2015-01-26 Tom

有2種方式來解決這個問題 - 這取決於你如何實現select - 以及多少選擇的ng-model將舉行。

＃1 - 有功能名稱作爲選擇

的NG-模型當你創建一個select正常<options> - 即沒有ng-options（像你一樣） - 該ng-model只能容納功能名稱一個字符串 - 這是<option>的值。

<select ng-model="filterFnName"> 
    <option value="sortByRtRating">Rotten Tomatoes rating</option> 
    <option value="sortByImdbRating">IMDB rating</option> 
</select>

然後，你需要$eval獲得功能出了函數名（功能需要在範圍暴露）：

<div ng-repeat="movie in movieList | orderBy:$eval(filterFnName):true">{{movie}}</div>

＃2 - 與功能的NG-的選擇

模型這是僅與ng-options儘可能角可以綁定到一個複雜的對象（包括函數）。

您可以定義在你的控制器以下幾點：

$scope.filterFns = [ 
    {l: "Rotten Tomatoes rating", fn: sortByRtRating}, 
    {l: "IMDB rating", fn: sortByImdbRating} 
]; 
$scope.filterFn = sortByRtRating; 

function sortByRtRating(item){...} 

function sortByImdbRating(item){...}

而且你可以選擇和使用實際的函數對象：

<select ng-model="filterFn" ng-options="f.fn as f.l for f in filterFns"> 
</select> 

<div ng-repeat="movie in movieList | orderBy:filterFn:true">{{movie}}</div>

plunker

來源

2015-01-27 01:06:32

傳遞函數作爲AngularJS中的選擇值

回答

相關問題