我的 ngmodel 没有重新加载，绑定不起作用答案

【问题标题】：my ngmodel does not reload, the binding is not working我的 ngmodel 没有重新加载，绑定不起作用
【发布时间】：2020-04-13 23:51:00
【问题描述】：

实际上，这段代码来自 ionic，我正在处理通过照片捕获获得的图像。一切正常，我得到了 blob，但由于某种原因，我的图像没有显示在模板中，我认为角度绑定没有更新。我能做些什么来强迫它？

    myblob:any=null;
    takePhoto() {
        const options: CameraOptions = {
        quality: 60,
        destinationType: this.camera.DestinationType.FILE_URI,
        encodingType: this.camera.EncodingType.JPEG,
        mediaType: this.camera.MediaType.PICTURE,
        allowEdit: true,
        };

        this.camera.getPicture(options).then(
        (imageData) => {
            this.file
            .resolveLocalFilesystemUrl(imageData)
            .then((entry: FileEntry) => {
                entry.file((file) => {
                    this.readFile(file);
                });
            });
        },
        (err) => {
            // Handle error
        }
        );
    }


    readFile(file: any) {
        const reader = new FileReader();
        reader.onloadend = () => {
        const imgBlob = new Blob([reader.result], {
            type: file.type,
        });
            //my ngModel (updating)   ****------------->
            this.myblob = URL.createObjectURL(imgBlob);
            console.log(this.documento_reverso);
        };
        reader.readAsArrayBuffer(file);
    }

在我的模板中：

    <button (click)="takePhoto()">Take photo</button>
    <img *ngIf="myblob" [src]="myblob">  --> is not show at first time button click

怎么办？

当我点击按钮并获取照片时，图像不显示，但我第二次点击按钮时立即显示。

【问题讨论】：

标签： angular

【解决方案1】：

您可以将代码包装在NgZone.run 中，以确保它在 Angular 区域中运行并且更改检测会检测到更改：

import { NgZone } from '@angular/core';

constructor(private ngZone: NgZone) { }

readFile(file: any) {
  ...
  this.ngZone.run(() => {
    this.myblob = URL.createObjectURL(imgBlob);
  });
  ...
}

【讨论】：