6

AngularJS ディレクティブ内でフィルターを使用しようとしていますが、正確な方法がわかりません。メーリング リストに関するいくつかの情報から、$filter を注入して使用できるはずですが、どこでどのように呼び出すかがわかりません。

私のディレクティブは現在次のようになっています。

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

は機能しfilter:tagFilterていませんが。ディレクティブでデータをフィルタリングするにはどうすればよいですか?

JSfiddle はhttp://jsfiddle.net/VDLqa/4/で入手できます 。

4

2 に答える 2

13

ディレクティブ ( scope: { 'fancyDisplay': '=' }) で新しい Isolate スコープを作成しています。つまり、親スコープからプロパティにアクセスすることはできません。は親スコープで定義されているためtagFilter、アクセスできません。

tagFilter属性としてディレクティブに渡します。

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

そしてディレクティブで：

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

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

于 2013-02-28T14:49:48.610 に答える
1

@bmleite の回答に感謝します。

リストに重複がある場合に備えて、次のように ng-repeat ディレクティブを宣言することをお勧めします。

これを理解するのに永遠にかかりました。どうやら x でトラックを指定する前にフィルタリングする必要があります:

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

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

});

逆は機能しません。

于 2014-01-31T01:08:29.000 に答える