basst314 / ngx-webcam

A simple Angular webcam component / pure & minimal, no flash-fallback
https://basst314.github.io/ngx-webcam/?
MIT License
228 stars 104 forks source link

Can't bind to 'switchCamera' since it isn't a known property of 'webcam'. #89

Closed lawaldare closed 4 years ago

lawaldare commented 4 years ago

core.js:12478 Can't bind to 'switchCamera' since it isn't a known property of 'webcam'. core.js:12478 Can't bind to 'trigger' since it isn't a known property of 'webcam'.

I have been having this warning error in the console and the webcam is not working at all

basst314 commented 4 years ago

Hi @lawaldare Could you share your code, how you have added the webcam component to your page? Also, checkout the Readme for further usage information. Thanks!

lawaldare commented 4 years ago

<webcam [height]="500" [width]="500" [trigger]="triggerObservable" (imageCapture)="handleImage($event)" [imageQuality]="1" (initError)="handleInitError($event)"></webcam> <br /> ` <button class="actionBtn" (click)="triggerSnapshot();">Take A Snapshot <div class="snapshot" *ngIf="webcamImage">

Nice one!

                <img [src]="webcamImage.imageAsDataUrl" />
            </div>`

` public showWebcam = true; public webcamImage: WebcamImage = null;

// webcam snapshot trigger
private trigger: Subject<void> = new Subject<void>();
// switch to next / previous / specific webcam; true/false: forward/backwards, string: deviceId
// private nextWebcam: Subject<boolean | string> = new Subject<boolean | string>();

public get triggerObservable(): Observable<void> {
    return this.trigger.asObservable();
}
public triggerSnapshot(): void {
    this.trigger.next();
}
 public handleImage(webcamImage: WebcamImage): void {
    console.info('received webcam image', webcamImage);
    this.webcamImage = webcamImage;
}`

I also imported it in the AppModule, I think the fact that it throwing this error: Can't bind to 'trigger' since it isn't a known property of 'webcam'. in the console that's why it ain't working. It's not even asking for camera access

basst314 commented 4 years ago

Hmm, seems to be okay. Can you compare your code and inclusion in AppModule to this demo project? https://github.com/basst314/ngx-webcam-demo/tree/master/src/app You can also try copying this code into your project to see if it makes a difference.

Also, what happens if you only add <webcam></webcam> without any properties?

lawaldare commented 4 years ago

Yes, thanks it's working now. I wasn't importing it in the right module. I thought importing it in the App module will make it work anywhere in the component but I had to import it in the closest module of the component. Thanks

basst314 commented 4 years ago

Glad you got it fixed!