ngx-webcam for specific view and component angular 6

Question

I am using ngx-webcam in my application to capture image using webcam. I have import library in app.module.ts and also on my view but it gives me this error 'webcam' is not a known element. If using webcam tag in app.component html it work good but i want to use it in separate view. This is my code

import {WebcamImage} from 'ngx-webcam';

export class CreateMemberComponent implements OnInit {
 private trigger: Subject<void> = new Subject<void>();

 // latest snapshot
 public webcamImage: WebcamImage = null;
public triggerSnapshot(): void {
    this.seconds = 3;
    this.trigger.next();
    this.seconds = null;
  }

  public handleImage(webcamImage: WebcamImage): void {
    console.log('received webcam image', webcamImage);
    this.webcamImage = webcamImage;
  }

  public get triggerObservable(): Observable<void> {
    return this.trigger.asObservable();
  }

here is my html code

<div class="col-sm-4">
    <div style="text-align:center">
        <div>
          <p>{{seconds}}</p>
          <webcam [trigger]="triggerObservable" (imageCapture)="handleImage($event)"></webcam>
          <br/>
          <button id="snapshotBtn" (click)="triggerSnapshot();">Take A Snapshot</button>
        </div>
      </div>
      <div class="snapshot" *ngIf="webcamImage">
        <h2>Nice one!</h2>
        <img [src]="webcamImage.imageAsDataUrl"/>
      </div>
</div>

Please see the attached image for reference.

Answer 1

As you have module named member-profile then you should import it member-profile module as you did it app.module. If you remove it from app.module it will still work in components associated with member-profile module.

import {WebcamModule} from 'ngx-webcam';

@NgModule({
  imports: [
    WebcamModule
  ],
  declarations: [CreateMemberComponent, UpdateMemberComponent, MembersListComponent]
})
export class MembersProfileModule { }

This will do the trick for you.