为什么触发事件只能在setTimeout中工作？

Question

我正在编写一个angular 4.1.2组件作为select2 4.0.3的包装器

我是angular和typescript的新手，所以也许我错过了一些东西。

我知道有一些可用的npm包可以用来获得它，但我想让我的员工尽可能简单。

实际上，在我编写的组件工作的那一刻，

但是有一段代码，我不明白为什么一定是这样的，我希望你能给我一些点子。

考虑这个伪typescript代码(实际上我在基类和抽象类中有很多东西，所以为了使它更具可读性，我在单个组件中进行了剪切粘贴……

注意:我将jquery和select 2声明为any，因为我在页面中包含了它们的脚本(而不是npm / angular-components)

declare var $: any;
declare var select2: any;

@Component({
    moduleId: module.id,
    selector: 'select-x',
    template: `
        <select #select [(ngModel)]="value">
        </select>
    `,
    providers: [{
        provide: NG_VALUE_ACCESSOR,
        useExisting: forwardRef(() => SelectX),
        multi: true,
    }],
})

export class SelectX {

    // CUT ...

    ngAfterViewInit() {
        // validations
        // CUT ...

        var $select = $(this.select.nativeElement);

        // basic configuration
        $select.select2({
            // CUT ...
            ajax: {
                url: this.dataUrl,
                dataType: 'json',
                // CUT ...
            },
        });

        // on select 2 change => trigger model change
        $select.on("change", (event: any) => {
            // CUT ...
        });


        // set default value [WORKING]
        window.setTimeout(() => {
            var d = { data: { id: this.value, text: this.text } };
            $select.select2("trigger", "select", d);
        }, 0);

        /* set default value [NOT WORKING]
        var d = { data: { id: this.value, text: this.text } };
        $select.select2("trigger", "select", d);
        */

    }
}

我不能理解的是，为什么我必须使用"windows.setTimeout“来触发选择...

如果我直接编写select2触发器，select2组件根本不会更新...

但它不起作用。

你有什么要给我的提示吗？

更新:我尝试使用文档就绪...我得到了ExpressionChangedAfterItHasBeenCheckedError

$(() => {
    console.log("ready");
    $(this.select.nativeElement).select2("trigger", "select", { data: { id: "123123", text: "item 123123" } });
});

然后我创建了这个：ExpressionChangedAfterItHasBeenCheckedError Explained也许

现在我正在读这个问题...

Answer 1

有时，对于JavaScript (包括JavaScript的形式)，显示中的更改最终会发生冲突，因此超时允许事情在完成某些事情之前完成。这就是为什么我相信他们会在函数中放入这一小段代码。