Javascript 在Angular 2+；中将元素添加到ngFor后，如何运行一些代码；？

我的组件中有一个函数，它将元素添加到视图中由*ngFor显示的数组中

我希望通过id将添加的元素作为目标，并在将其添加到数组后滚动到该元素。问题是此代码在将元素添加到视图之前运行

---

如何在Angular 2+中解决此问题？

您可以使用自定义指令执行通知：

@Directive({ selector: '[afterAdd]')
class MyDirective {
  @Output() added:EventEmitter = new EventEmitter();
  ngAfterContentInit() {
    this.added.next(null);
  }
} 

然后像这样使用它：

<div *ngFor="let item of items" afterAdd (added)="doSomething(item)">

---

这仅仅是关于初始添加，还是如果您将项目添加到您使用的阵列中，我使用的是良好的解决方案。但是，我不想在所有项目的初始添加上运行此操作。只有在已经存在的列表中添加了一项时，我才想向下滚动到最后一项。太好了！你的第二种方法很有用，很有魅力。谢谢。很高兴听到：）

constructor(private cdRef:ChangeDetectorRef) {}

...
this.items.push(newItem);
this.cdRef.detectChanges(); // sync
// here the item was added to the DOM already