Angular 只有在我的视图（及其NGFOR等）发生更改后，我如何才能执行代码？

我正试图实现一个放大弹出解决方案，以一个充满图像的页面。因为它们是通过*ngFor渲染的，所以初始化弹出功能的代码是在渲染图像之前运行的

---

是否有一种方法仅在视图完成渲染（或者，更好的是，视图内容已更改）时运行代码？我见过当组件的@Inputs发生变化时执行代码的方法，但当其内部方法发生变化时就不会了。

目前没有内置支持

您可以将

*ngFor

的内部字段绑定到setter，并在更改方法时调用它们

使用

set someValue（newValue）{
这个。_someValue=newValue；
setTimeout（（）=>afterValueChanged（），10）；
}

应该延迟执行

afterValueChanged（）

足够长的时间来更新DOM。这样，

afterValueChanged（）

将在事件队列中排队，并且应该在实际执行此计划的事件队列任务时执行此操作。

解决方案（至少据我所知）：ngAfterViewInit

import {Component, AfterViewInit} from 'angular2/core';

export class Gallery implements AfterViewInit {

    ngAfterViewInit() {
        $('.gallery')['magnificPopup']({
            delegate: 'a',
            type: 'image',
            gallery: {
                enabled: true
            }
        });
    }
}

---

显然，课堂上不相关的部分被忽略了。调用ngAfterViewInit内方法的方括号表示法是必需的，因为TS编译器在使用点表示法时会抱怨缺少属性（在编译时为true，但在运行时不是）。是否需要AfterContentInit，因为它不会等待ngFor完成？@eesdil可能-it（ngAfterViewInit）到目前为止，似乎对我很有效，但迭代数组中的元素数量可能不会太多。如果页面上的元素太多，则应使用

changeDetectionStrategy.OnPush

，以防止由于重载而导致的延迟和崩溃，