angularjs過濾器不返回自定義結果

Im新到anularJS並決定創建一個小個人項目。不過，我試圖避免多次顯示一個值。我的模型看起來是這樣的：angularjs過濾器不返回自定義結果

{ 
    "artist": "Tinchy Stryder", 
    "album": "Catch 22", 
    "filename": "01 - Take Off.mp3", 
    "filepath": "Tinchy Stryder\/Catch 22\/01 - Take Off.mp3", 
    "modified": 1388837746 
}, 
{ 
    "artist": "Tinchy Stryder", 
    "album": "Catch 22", 
    "filename": "02 - I'm Landing.mp3", 
    "filepath": "Tinchy Stryder\/Catch 22\/02 - I'm Landing.mp3", 
    "modified": 1388837800 
}, 
{ 
    "artist": "Tinchy Stryder", 
    "album": "Catch 22", 
    "filename": "03 - Take Me Back (feat. Taio Cruz).mp3", 
    "filepath": "Tinchy Stryder\/Catch 22\/03 - Take Me Back (feat. Taio Cruz).mp3", 
    "modified": 1388837861 
}

我想只顯示'藝術家'一次。我不想限制ng-repeat到一個項目，因爲我需要通過每個文件名重複。我曾嘗試過創建此過濾器：

musicApp.filter('uniqueartist', function(){ 
    var keys = []; 
    var output = ""; 

    return function(input, opt){ 

     if(keys.indexOf(input) === -1){ 
      output = input; 
      console.log(output) 
      return output; 
     }else{ 
      output = ""; 
      return output; 
     } 

     console.log(keys.indexOf(input)); 
     keys.push(input); 

     return output; 
    } 
});

但它仍然會在每次重複時返回藝術家名稱。這裏是我的HTML剪輯

<div class="row" data-ng-controller="SimpleController"> 
    <li ng-repeat="music in musics"> 
     <header><h4>{{music.artist | uniqueartist }}</h4></header> 
     <p>{{music.filename}}</p> 
     <a href="{{music.filepath}}">Listen</a> 
    </li> 
</div>

ANy想法，爲什麼這不工作？

來源

2014-01-05 DBrowne

你回來得太早，甚至在keys.push(input)之前。

此外，在過濾器中保持狀態是一個壞主意，因爲它們可能被調用任意次數。例如，如果數組發生變化，那麼ng-repeat可能會再次運行，在這種情況下不會顯示任何內容，因爲過濾器狀態不會被重置。

在顯示控制器之前，最好修改控制器本身的數據模型。如果您不想進行破壞性更改，也許再添加其他屬性。

來源

2014-01-05 07:15:47

感謝您的回覆。你說我回來得太早了......但是我回報了輸出;將輸入按入鍵後。感謝您的幫助，我認爲我會修改數據模型，而不是像您推薦的那樣，最好的做法 – DBrowne

@DBrowne您的if和else都有return語句。推後也沒有效果後的回報。無論如何，就像我說的，過濾器可能不是最好的用途。 –

angularjs過濾器不返回自定義結果

回答

相關問題