- 一些网站总会有各式的验证操作，比如经常见到的输入验证码、拖动验证、手机信息验证、拼图式的验证方式。在这里，给大家推荐一个比较简单好用的
angular项目使用的拼图式的验证组件ng-jigsaw.
安装
npm i ng-jigsaw --save
引用
在angular.json中引入基本样式：
...
"styles": [
"node_modules/ng-jigsaw/ng-jigsaw.css"
],
...
在 app.component.ts中引入NgJigsawModule
import { NgJigsawModule } from 'ng-jigsaw';
...
imports:[
...
NgJigsawModule,
]
使用
普通使用
<ng-jigsaw mode='default'></ng-jigsaw>
显示图片控制
使用者可根据需求替换验证的背景图片
html:
<ng-jigsaw mode='default' (successBack)="success()" (refreshBack)="refresh($event)"></ng-jigsaw>
ts:
refresh(e){
e.src = "https://picsum.photos/300/150/?image=60"
}
效果
