angularjs 필터가 사용자 정의 결과를 반환하지 않음

Question

새로운 anularJS에 새로 추가하여 개인 프로젝트를 거의 만들지 않기로 결정했습니다. 그러나 Im은 값을 두 번 이상 표시하지 않으려 고합니다. 내 모델은 이렇게 보입니다 :

{ 
    "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> 

왜이 isnt 작동합니까?

Answer 1

keys.push(input) 이전에도 너무 일찍 돌아옵니다.

또한 상태를 임의의 횟수만큼 호출 할 수 있으므로 필터에 상태를 유지하는 것은 좋지 않습니다. 예를 들어 배열이 변경되면 ng-repeat가 다시 실행되어 필터 상태가 재설정되지 않으므로 아무 것도 표시되지 않습니다.

데이터 모델이 표시되기 전에 컨트롤러에서 데이터 모델을 수정하는 것이 가장 좋습니다. 파괴적인 변경을 원하지 않으면 다른 속성을 추가하십시오.