角2 - 文字列を自動的に値の変更時にクリップボードにコピー

Question

文字列を返す角度サービスがあり、この文字列をユーザーのクリップボードに挿入します。

私は、入力中に結果を表示し、ユーザーは、自動コピーに失敗した場合には、「コピー」ボタンをクリックできるようにangular2-clipboardをインストールしました。 しかし私の願いは、プロパティにバインドされた入力値が変更されると、自動的にクリップボードの内容をその新しい値で設定することです。これは、現在取り組んでいる

：

<input readonly type="text" class="form-control" [(ngModel)]="createdCode"> 
<button class="btn btn-default" type="button" ngIIclipboard [cbContent]="createdCode">copy</button> 

私は、クリックイベントを発生させるために、「＃1 btn.onclickを（）」コールするが、期待される動作を取得できませんでしたNG-変更を伴う方法を見つけることを試みました。

これを行う方法はありますか？

Answer 1

私はangular2-クリップボードを使用せずに作っていたアプリケーションでこれを達成しました。

私はViewChildとElementRefを使用してDOM要素を参照し、私はこのような機能を使用：

@ViewChild('plainVersion') plainVersion: ElementRef; 
 
    plain.value = this.plainVersion.nativeElement.innerText; 
 
    plain.select(); 
 
    try { 
 
     let success = document.execCommand('copy'); 
 
    } catch(err){ 
 
     console.log(err); 
 
    } 
 
    window.getSelection().removeAllRanges();

角度/コア@からViewChildとElementRefをインポートすることを確認します。

私はChromeのみでこれをテストしているが、それは他のブラウザで動作する可能性があります。