javascript - 无法读取未定义 Angular 8 的属性实例
问题描述
我有一个模态,我会在其中使用一个组件(ngx-image-cropper),但每次在图像裁剪器上出现“无法读取未定义的属性实例”时都会出现此错误。
Preview() 被成功调用并且 this.logoToUpload 工作正常,问题是使用图像裁剪器组件打开模态,否则模态也能正常工作。
这是我的代码:
import { ImageCroppedEvent, LoadedImage } from 'ngx-image-cropper';
@Component({
selector: 'logo',
templateUrl: './logo.component.html',
styleUrls: ['./logo.component.scss']
})
export class LogoComponent implements OnInit {
constructor(
private modalService: NgbModal,
) {}
ngOnInit() {}
preview(content) {
var mimeType = this.logoToUpload.type;
if (mimeType.match(/image\/*/) == null) {
return;
}
debugger;
// Show preview
this.modalService.open(content).result.then(
(result) => {
//DO SOMETHING IN CASE RESULT IS SAVE OR NOT
}, (reason) => {
});
}
HTML:
<ng-template #modalCroppingImage let-modal>
<div class="modal-header modal-header-new">
Select area
</div>
<div class="modal-body">
<image-cropper [imageFile]="logoToUpload"
[maintainAspectRatio]="true"
[aspectRatio]="4 / 3"
format="png"
(imageCropped)="imageCropped($event)"
(imageLoaded)="imageLoaded()"
(cropperReady)="cropperReady()"
(loadImageFailed)="loadImageFailed()"></image-cropper>
</div>
<div>
<button type="button" class="btn btn-primary button-modal-detail-new" (click)="modal.close('Save'); resetView();">SAVE<!--Close--></button>
<button type="button" class="btn btn-primary button-modal-detail-new" (click)="modal.close('Close'); resetView();">CLOSE<!--Close--></button>
</div>
</ng-template>
编辑:我也收到此错误:
StaticInjectorError(AppModule)[ImageCropperComponent -> CropService]: StaticInjectorError(Platform: core)[ImageCropperComponent -> CropService]: NullInjectorError: 没有 CropService 提供者!
解决方案
我发现了问题,Angular 8 不再支持 ngx-image-cropper。如果你有同样的问题,你必须安装 3.3.5 版本。
推荐阅读
- java - 让 Java 使用输入标签
- node.js - 如何使用节点js为首先在用户部分注册的用户分配管理员角色
- azure - Azure Log Analytics 和带有架构的自定义日志?
- css - Understrap - scss 停止工作,未重新加载
- three.js - Three.js 上的 STLLoader:加载资源失败:服务器响应状态为 404(未找到)
- spring-boot - Keycloak:使用 FluentTestsHelper 进行测试
- mongodb-query - 使用通配符的嵌套查询
- c - 为 Python 程序员优化编译器心态
- google-cloud-platform - BigTable Emulator cbt 在创建表时出错“传输:身份验证握手失败:tls:第一条记录看起来不像 TLS 握手”
- c# - 我应该如何让我的“goto”最后不运行?