ngx-clipboard没有Token DOCUMENT的提供者

时间:2018-06-01 12:48:51

标签: angular ngx-clipboard

尝试使用ngx-clipboard v.7.0.6并在我的组件中使用ClipboardService并收到此错误:Promise rejection: No provider for Token DOCUMENT! ;

模块:

import {NgModule}                         from '@angular/core';
import {CommonModule}                     from '@angular/common';
import {BrowserModule}                    from '@angular/platform-browser';
import {RouterModule}                     from '@angular/router';
import {ReactiveFormsModule}              from '@angular/forms';
import {ClipboardModule}                  from 'ngx-clipboard';
import {ClipboardService}                 from 'ngx-clipboard/src';

@NgModule({
  imports: [
    CommonModule,
    ClipboardModule,
    BrowserModule,
    RouterModule,
    ReactiveFormsModule
  ],
  declarations: [],
  providers: [
    ClipboardService
  ]
})

export class MyModule {}

组件:

import {Renderer} from '@angular/core';
import {ClipboardService} from 'ngx-clipboard/src';

@Component({
  selector: 'app-my',
  templateUrl: '../tmp.html',
  styleUrls: ['../tmp.css']
})
export class MyComponent {
  constructor(
    private renderer: Renderer,
    private clipboardService: ClipboardService
  ) {}

  copy(text) {
    this.clipboardService.copyFromContent(text, this.renderer);
  }
}

2 个答案:

答案 0 :(得分:0)

安装ngx-clipboard版本12.1.1。

  

将package.json中的版本从x.x替换为“ ngx-clipboard”:   “ 12.1.1”

参考:https://github.com/maxisam/ngx-clipboard/issues/190

答案 1 :(得分:-1)

尝试在应用程序的声明中添加ClipboardModule

import {NgModule}                         from '@angular/core';
import {CommonModule}                     from '@angular/common';
import {BrowserModule}                    from '@angular/platform-browser';
import {RouterModule}                     from '@angular/router';
import {ReactiveFormsModule}              from '@angular/forms';
import {ClipboardModule}                  from 'ngx-clipboard';
import {ClipboardService}                 from 'ngx-clipboard/src';

@NgModule({
  imports: [
    CommonModule,
    ClipboardModule,
    BrowserModule,
    RouterModule,
    ReactiveFormsModule
  ],
  declarations: [ClipboardModule],
  providers: [
    ClipboardService
  ]
})

export class MyModule {}