簡體   English   中英

用過濾器更新ng-repeat

[英]update ng-repeat with filter

我有一些正在使用的角度代碼,希望很快能重構。
我正在嘗試根據復選框來過濾ng-repeat

我有一個看起來像這樣的數據樹...

{
    name: 'mail',
    rating: 2.4,
    source: 'EDD',
    users: 1000,
    description: ''
}

設置ng-repeat工作以迭代遍歷

<li ng-repeat="rule in property">{{rule[entityPropertyName]}</li>

將該屬性重命名為searchController中存在的產品服務,如下所示

的HTML

<search-section productName="qualifier" 
                product="qualifiers" 
                entityPropertyName="name"></search-section>

指示

controller: 'searchController',
scope: {
    product: '=',
    productName: '@',
    entityPropertyName: '@'
},

我正在使用控制器中的簡單功能通過復選框進行過濾

$scope.filterAdded = function(sourceName) {
    if($scope.filteredQualifiers.sourceName[sourceName]) {
        return sourceName;
    }
}  // returns source name 

返回源名稱,例如: mediaage

我希望我可以補充

$scope.filterAdded 

像這樣到ng-repeat迭代器

<li ng-repeat="rule in property | filter: filterAdded">{{rule[entityPropertyName]}</li>

像這樣的指令將支持此過濾器

scope: {
    entities: '=',
    entityName: '@',
    entityPropertyName: '@',
    filterAdded: '&'
},

隨着filterAdded被視為一個功能。

添加過濾器后,返回單個值,如EDD

我確定自己需要過濾規則源。

source: 'EDD'

沒有看到可以比較get rule.source和filterAdded值的方法。

<li ng-repeat="rule in property | filter: filterAdded"></li> 

任何見解或反饋表示贊賞。

我將學習Angular 4,因此我將使用這種語言,但您可以適應angular js(1.x)。

如果我做對了,可以將ngFor或ngRepeat與ngIf一起使用,而不要使用管道。

<ul *ngFor=" let rule in property">

*請注意,ngFor將用於ul,而不是li。

然后,在li標簽上,我將使用ngIf檢查它是否在某個過濾器下。 在ng上,如果您可以綁定到一個函數,甚至可以傳遞對象或數組項的屬性,則可以像這樣進行迭代:

<li *ngIf="isThisOnFilter(rule['rating'])">{{ rule['name'] }}</li>

希望能幫助到你。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM