在生产代码中使用 setTimeout 是否安全？答案

【问题标题】：Is it safe to use setTimeout in production code?在生产代码中使用 setTimeout 是否安全？
【发布时间】：2017-03-02 11:05:44
【问题描述】：

我有一个使用 Material Design Lite 的 angular2 组件，但复选框（可能还有其他）元素在第一次加载组件时未正确呈现，而如果我与复选框交互，则正确应用了 mdl 样式。在我的组件中，我有

ngAfterViewInit() {
    componentHandler.upgradeDom();
}

但这并不能解决我的问题，所以我使用 setTimeout 在服务返回一些数据后立即执行。这似乎可行，但建议这样做吗？

this.service.getDetails(this.id)
            .finally(() => {
                setTimeout(() => {
                    componentHandler.upgradeDom();
                }, 10);
            })
            .subscribe((details) => {
                this.details = details;
            });

【问题讨论】：

它在那里，所以它可以使用。它只是您想要使用的地方以及如何使用！
也许你可以试试changeDetection: ChangeDetectionStrategy.OnPush。你可以在Change Detection Explained找到一些有用的信息

标签： javascript angular settimeout material-design-lite

【解决方案1】：

如果您也将组件设置添加到问题中会有所帮助。查看 angular.io 文档的组件样式部分。我想您需要的只是将选择器和样式添加到组件的注释中。来自文档：

@Component({
   selector: 'hero-app',
   template: `
       <h1>Tour of Heroes</h1>
       <hero-app-main [hero]=hero></hero-app-main>`,
   styles: ['h1 { font-weight: normal; }']
})
export class HeroAppComponent {
    /* . . . */
}

【讨论】：

【解决方案2】：

在不了解代码的来龙去脉的情况下，纯粹从理论上讲，您引入的竞争条件（无论是什么导致延迟）必须在 10 毫秒内完成。

你能确认它会一直这样做吗？如果可以（100% 确定）我会说没关系。但是，根据经验，我会说不要使用超时，而是尽可能使用事件。

请注意：我还没有使用过 Angular 2，但我知道在 Angular 1 中，有时需要手动触发摘要。这可能就是这里发生的事情。

【讨论】：