Angular 7图片上传后无法即时显示，需点击页面才渲染的问题

• 变更检测策略不匹配
  若你的组件设置了ChangeDetectionStrategy.OnPush，Angular只会在输入属性变更、组件内部事件触发或手动调用变更检测时更新视图。上传图片后修改预览数据时，若没满足OnPush的变更触发条件，视图就不会即时更新。而StackBlitz默认组件采用Default变更检测策略，会自动检测大部分数据变化，因此能正常即时显示。

• 异步回调运行在Angular Zone之外
  处理图片上传的FileReader回调属于原生异步操作，默认可能脱离了Angular的NgZone上下文。此时你在回调里更新组件的预览URL或数据，Angular的变更检测机制无法感知到这一变化，导致视图不更新。点击页面时会触发全局变更检测（点击事件属于Angular Zone内的操作），才会渲染出图片。StackBlitz的环境可能默认将这类异步操作包裹在了NgZone中，所以能即时触发视图更新。

• 引用类型数据未触发引用变更
  如果你是直接修改数组或对象的属性（比如this.imageData.url = newUrl），而非替换整个数组/对象的引用，Angular的变更检测因是浅对比，可能无法识别数据变化。这种情况下只有触发其他变更检测触发点（如点击页面）才会更新视图。

内容的提问来源于stack exchange，提问作者Abhiz