0

もう一度、パフォーマンスの低下に遭遇しng-repeat、要素の配列をレンダリングするディレクティブを構築する方法がわかりませんng-repeat(テンプレートであっても)。

それで、どうやってそれをしますか？

要素ごとにテンプレートを使用して配列を反復処理しても、次のようになります。 

.directive('foo', function($parse, $compile) {
    return {
        restrict: 'E',
          scope: { items: '=myarray' },
            link: function (scope, element, attrs){
                 var tmplt = '<div> {{name}} </div>';
                 scope.items.forEach(function(){
                     element.append(tmplt(scope)); 
                     // now I'd like to have a scope of that element, 
                     // and pass it into the template, and use properties related 
                     // only to that element
                     // but I don't know how to get a scope for a child element
                  });

             scope.$watch(attrs.myarray, function(value) { console.log('something change'); })

            }
        }});

すべての要素に対して 1 つのテンプレートを使用ng-repeatすることを選択した場合も、その中で使用する以外に選択肢がなく、ngRepeatWatchers が作成され、すべてが再び遅くなります。

4

1 に答える 1

0

私は@Markに同意しますが、ここにあなたの質問に対する汚い解決策があります：

http://plnkr.co/edit/wxM8mSoNsRGXBJUao5Xb?p=preview

アイデアは、分離された子スコープを作成することです。

              scope.items.forEach(function(item){                     
                 var childScope = scope.$new(true);                     
                 angular.extend(childScope, item);
                 element.append($compile(tmplt)(childScope)); 
              });

また、更新のたびにこれらの子スコープを削除することを忘れないでください。

そして、このソリューションをベンチマークする必要がありました。これは、ngRepeatと比較して、より高速でどれだけかを確認するためです。

于 2013-02-01T08:53:48.300 に答える