Search code examples
angularionic-frameworkcordova-plugins

Ionic Camera: No value accessor for form control with name

I'm using the cordova-plugin-camera plugin in an Ionic app. I managed to make the camera to take a picture and to display it after bit I get this error:

No value accessor for form control with name 'photo'

I think I might not fully understand how the FormBuilder works. Here is what I got:

register.html

<img *ngIf="register_form.controls.photo.value != ''" formControlName="photo" [src]="domSanitizer.bypassSecurityTrustUrl(register_form.controls.photo.value)" />

register.ts file

ionViewWillLoad() {
  this.register_form = this.formBuilder.group({
    ...
    photo: new FormControl('', Validators.required)
  });
}
...
onTakePicture(){
  ...
  this.camera.getPicture(options).then((imageData) => {
        const image: FormControl = (<any>this.register_form).controls.photo;
        image.setValue('data:image/jpeg;base64,' + imageData);
    }, (err) => {
  });
}

What is wrong ?

Solution

  • formControlName can be used only for the control or directives which implements ControlValueAccessor. Since you are using img which doesn't implement ControlValueAccessor, you cannot use here.

    Fore more info visit - https://angular.io/api/forms/ControlValueAccessor