像ngFor,iterableDiffer这样的Angular 2编写结构指令可能会导致错误

时间:2017-06-16 05:56:38

标签: javascript angular2-directives ngfor ng-template

您好我是Angular 2的新手,并希望编写一个ngFor实现来练习。我找到了这个教程:  https://teropa.info/blog/2016/03/06/writing-an-angular-2-template-directive.html

我有它工作,但最近我一直收到这个错误。 “ERROR TypeError:this._trackByFn不是函数”。

我希望可以对此进行更多调试,但文档很少,而且我并不完全理解IterableDiffer(s)。所有人都看到它在41号线后死亡。我一直试图弄清楚我现在几个小时内的变化。

let changes = this.differ.diff(this.collection);

这是插件:http://plnkr.co/edit/aM8Wdz72gu7BVNAN9Ulv?p=preview

感谢您提供的任何帮助。

更新

我发现如果我在Angular 2中运行它,我可以让我的指令工作,并取出不同的输入,如下所示:
private differ:IterableDiffer(现在)
private differ:IterableDiffer<any>(之前)

仍然不是解决方案,因为我想弄清楚如何在Angular 4中完成这项工作。

1 个答案:

答案 0 :(得分:1)

我怀疑问题是您对集合进行区分的上游。 Angular 4删除了IterableDifferFactory的ChangeDetectorRef参数。我建议你回到你的Angular 4版本并更改代码行,你会得到与以下内容不同的代码:

this.differ = this.differs.find(coll).create(this.changeDetector);

类似于:

this.differ = this.differs.find(coll).create((value) => value);

我在我的自定义版本的ngFor上进行了更改,并允许它在Angular 4中工作。