大佬教程收集整理的这篇文章主要介绍了angular5 – ngx-webcam用于特定视图和分量角6,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
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(); }
这是我的HTML代码
<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>
请参阅附图以供参考.
import {WebcamModule} from 'ngx-webcam'; @NgModule({ imports: [ WebcamModule ],declarations: [CreateMemberComponent,UpdateMemberComponent,MembersListComponent] }) export class MembersProfileModule { }
这将为你做到这一点.
以上是大佬教程为你收集整理的angular5 – ngx-webcam用于特定视图和分量角6全部内容,希望文章能够帮你解决angular5 – ngx-webcam用于特定视图和分量角6所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。