{"action":"created","issue":{"url":"https://api.github.com/repos/cstefanache/angular2-img-cropper/issues/204","repository_url":"https://api.github.com/repos/cstefanache/angular2-img-cropper","labels_url":"https://api.github.com/repos/cstefanache/angular2-img-cropper/issues/204/labels{/name}","comments_url":"https://api.github.com/repos/cstefanache/angular2-img-cropper/issues/204/comments","events_url":"https://api.github.com/repos/cstefanache/angular2-img-cropper/issues/204/events","html_url":"https://github.com/cstefanache/angular2-img-cropper/issues/204","id":232790830,"node_id":"MDU6SXNzdWUyMzI3OTA4MzA=","number":204,"title":"Cannot read property 'setImage' of undefined","user":{"login":"WeekendMan","id":28101854,"node_id":"MDQ6VXNlcjI4MTAxODU0","avatar_url":"https://avatars2.githubusercontent.com/u/28101854?v=4","gravatar_id":"","url":"https://api.github.com/users/WeekendMan","html_url":"https://github.com/WeekendMan","followers_url":"https://api.github.com/users/WeekendMan/followers","following_url":"https://api.github.com/users/WeekendMan/following{/other_user}","gists_url":"https://api.github.com/users/WeekendMan/gists{/gist_id}","starred_url":"https://api.github.com/users/WeekendMan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/WeekendMan/subscriptions","organizations_url":"https://api.github.com/users/WeekendMan/orgs","repos_url":"https://api.github.com/users/WeekendMan/repos","events_url":"https://api.github.com/users/WeekendMan/events{/privacy}","received_events_url":"https://api.github.com/users/WeekendMan/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":4,"created_at":"2017-06-01T07:38:12Z","updated_at":"2019-03-01T11:39:18Z","closed_at":null,"author_association":"NONE","body":"I'm trying to show user image to crop it after drop event and I'm getting the error (Angular2):\r\n\r\nEXCEPTION: Cannot read property 'setImage' of undefined\r\n\r\nThis is my component:\r\n\r\n```\r\nimport { ImageCropperComponent, CropperSettings } from 'ng2-img-cropper';\r\n\r\nexport class SomeComponent {\r\n  ...\r\n  @ViewChild('cropper', undefined) cropper: ImageCropperComponent;\r\n  public cropperSettings: CropperSettings = new CropperSettings();\r\n  public croppingData: { [ key: string ]: any } = {};\r\n  ...\r\n\r\n  constructor(private elementRef: ElementRef) {\r\n    this.cropperSettings.noFileInput = true;\r\n\r\n    this.cropperSettings.width = 200;\r\n    this.cropperSettings.height = 200;\r\n\r\n    this.cropperSettings.croppedWidth = 200;\r\n    this.cropperSettings.croppedHeight = 200;\r\n\r\n    this.cropperSettings.canvasWidth = 500;\r\n    this.cropperSettings.canvasHeight = 300;\r\n\r\n    this.cropperSettings.minWidth = 10;\r\n    this.cropperSettings.minHeight = 10;\r\n\r\n    this.cropperSettings.rounded = false;\r\n    this.cropperSettings.keepAspect = false;\r\n\r\n    this.cropperSettings.cropperDrawSettings.strokeColor = 'rgba(255,255,255,1)';\r\n    this.cropperSettings.cropperDrawSettings.strokeWidth = 2;\r\n  };\r\n\r\n  public onDrop(dragEvent: DragEvent): void {\r\n    let fileReader: FileReader = new FileReader();\r\n    fileReader.readAsDataURL(dragEvent.dataTransfer.files[0]);\r\n    fileReader.onload = (fileReaderEvent: any) => {\r\n      let wrapper: HTMLDivElement = this.findCroppingContainer();// returns DOM element\r\n      if (wrapper) {\r\n        let image: any = new Image();\r\n        image.src = fileReaderEvent.target.result;\r\n        this.cropper.setImage(image);// <-- this is the problem\r\n      }\r\n    };\r\n\r\n    dragEvent.stopPropagation();\r\n    dragEvent.preventDefault();\r\n  };\r\n}\r\n```\r\n\r\nThis is my template of this component:\r\n\r\n```\r\n<div class=\"imageWrapper\">\r\n  <img-cropper [image]=\"croppingData\" [settings]=\"cropperSettings\"></img-cropper>\r\n  <img [src]=\"croppingData.image\" title=\"Uploaded image\" alt=\"Uploaded image\" *ngIf=\"croppingData.image\">\r\n</div>\r\n```"},"comment":{"url":"https://api.github.com/repos/cstefanache/angular2-img-cropper/issues/comments/468637838","html_url":"https://github.com/cstefanache/angular2-img-cropper/issues/204#issuecomment-468637838","issue_url":"https://api.github.com/repos/cstefanache/angular2-img-cropper/issues/204","id":468637838,"node_id":"MDEyOklzc3VlQ29tbWVudDQ2ODYzNzgzOA==","user":{"login":"Sathishchary","id":12939444,"node_id":"MDQ6VXNlcjEyOTM5NDQ0","avatar_url":"https://avatars3.githubusercontent.com/u/12939444?v=4","gravatar_id":"","url":"https://api.github.com/users/Sathishchary","html_url":"https://github.com/Sathishchary","followers_url":"https://api.github.com/users/Sathishchary/followers","following_url":"https://api.github.com/users/Sathishchary/following{/other_user}","gists_url":"https://api.github.com/users/Sathishchary/gists{/gist_id}","starred_url":"https://api.github.com/users/Sathishchary/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Sathishchary/subscriptions","organizations_url":"https://api.github.com/users/Sathishchary/orgs","repos_url":"https://api.github.com/users/Sathishchary/repos","events_url":"https://api.github.com/users/Sathishchary/events{/privacy}","received_events_url":"https://api.github.com/users/Sathishchary/received_events","type":"User","site_admin":false},"created_at":"2019-03-01T11:39:18Z","updated_at":"2019-03-01T11:39:18Z","author_association":"NONE","body":"I have fixed with  ` @ViewChild(ImageCropperComponent) cropper:ImageCropperComponent;`. now its working for me"}}
{"actor":{"display_login":"Sathishchary"}}