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'); })

            }
        }});

如果我选择为所有元素使用一个模板,那么我别无选择,只能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 回答