Angular2 - ngx-clipboard无效

时间:2017-03-28 06:48:17

标签: angular ngx-clipboard

我安装了documentation中提到的ngx-clipboard,并且还在systemjs.config中包含了js。但是我得到了以下错误:

Unhandled Promise rejection: Template parse errors:
Can't bind to 'ngxClipboard' since it isn't a known property of 'button'. ("  </div>

这是我的模板:

<div class="col-xs-12 share-pageurl-label">
                    <a #copyTarget>{{pageURL}}</a>
                </div>
                <div class="col-xs-12 share-copy-btn">
                    <button [(ngxClipboard)]="copyTarget" (cbOnSuccess)="linkCopied()" 
                    [ngClass]="{linkCopied: isCopied}">
                        {{copyBtnLabel}} <span *ngIf="isCopied" class="glyphicon glyphicon-ok"></span>
                    </button>
                </div>

2 个答案:

答案 0 :(得分:3)

如果您没有正确导入ClipBoardModule,我相信您会收到此错误。如果您有嵌套模块并希望在较低级别使用,则必须确保将其导出到父模块,然后导入子模块。

parent.module

import { ClipboardModule } from 'ngx-clipboard';

@NgModule({
  declarations: [],
  imports: [
    ClipboardModule
  ],
  exports: [
    ClipboardModule,
  ]
})
export class ParentModule {
}

child.module

import { ParentModule } from '../../parent.module';

@NgModule({
imports: [
  ParentModule,
],
declarations: []
})
export class ChildModule {
}

答案 1 :(得分:0)

你试过plunker吗?还是Demo code

plunker

似乎正常

确保指向正确的位置

System.config({ map: { 'ngx-clipboard': 'node_modules/ngx-clipboard/dist/bundles/ngxClipboard.umd.min.js' } });