Sử dụng bộ lọc với các chỉ thị trong AngularJS

Question

Tôi đang cố gắng sử dụng các bộ lọc trong chỉ thị AngularJS nhưng không chắc chắn chính xác cách thực hiện. Từ một số thông tin trên danh sách gửi thư, có vẻ như bạn sẽ có thể tiêm $ filter và sử dụng nó, nhưng tôi không chắc chắn làm thế nào/ở đâu để gọi nó.

chỉ thị của tôi hiện trông như thế này:

myApp.directive('fancyDisplay', ['$filter', function($filter) { 
    return { 
     scope: { 
      'fancyDisplay': '=' 
     }, 
     template: "<div ng-repeat='datum in fancyDisplay | filter:tagFilter'>{{datum.name}}</div>" 
    }; 
}]); 

Mặc dù filter:tagFilter không được làm việc. Tôi nên lọc dữ liệu của mình theo chỉ thị như thế nào?

JSfiddle có sẵn tại http://jsfiddle.net/VDLqa/4/ Cảm ơn trước vì bất kỳ phản hồi nào.

Answer 1

Bạn đang tạo một phạm vi cô lập mới trên chỉ thị (scope: { 'fancyDisplay': '=' }), điều đó có nghĩa là bạn sẽ không thể truy cập các thuộc tính từ phạm vi gốc. Vì tagFilter được xác định trên phạm vi gốc, bạn sẽ không thể truy cập vào phạm vi đó.

đèo tagFilter như một thuộc tính để chỉ thị:

<div fancy-display="model.data" filter="tagFilter"></div> 

Và trên thị:

scope: { 
    fancyDisplay: '=', 
    tagFilter: '=filter' 
}, 

jsfiddle: http://jsfiddle.net/bmleite/VDLqa/5/

Answer 2

Nhờ @bmleite cho câu trả lời của bạn.

Một điều khác có thể hữu ích là đảm bảo khai báo chỉ thị ng-lặp lại của bạn như trường hợp này bạn đã làm mất trên danh sách của bạn.

Tôi đã mất rất nhiều thời gian để tìm hiểu điều này. Dường như bạn phải lọc trước khi bạn chỉ định đường đi theo x:

app.directive("someDirective", function(){ ... 

    restrict: "E", 
    ... 
    template:"<ul ng-repeat='t in tree | filter:key track by $index'><li>{{t}}</li></ul>", 

}); 

Nghịch đảo không hoạt động.