1、 下载安装插件
如果使用的是angular2, 不是angular4 那么安装 ngx-clipboard@7.x.x版本,如果是ng4安装最新版本。
npm install ngx-clipboard@7.0.1 --save
2、module.ts文件中引入
...
import {ClipboardModule} from 'ngx-clipboard';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
ClipboardModule
],
...
3、html文件中引入使用
参数说明
- ngxClipboard 必须 添加复制功能
- [cbContent]="text" 必须 text是要复制标签的ngModel,也就是要复制的内容,可以随便定义,不一定是那个model
- (cbOnSuccess) 可选 复制成功以后调用的函数
<div class="input-group">
<input type="text" class="form-control" [(ngModel)]="text" placeholder="请输入内容">
<span class="input-group-btn">
<button class="btn btn-default" type="button" ngxClipboard [cbContent]="text" (cbOnSuccess)="successFun()">copy</button>
</span>
</div>