CKEditorを有効または無効にする角度を使用してインライン編集

Question

ボタン/リンクのクリックに基づいてdivのckeditor.inlineを有効または無効にする方法を教えてください。

これは私がjqueryで達成する方法ですが、角度を使用してそれを把握することはできません。

$('.toggle-edit').click(function(e){ 
    var id_editedDiv = $(this).data('editTarget'); 
    var editedDiv = '#' + id_editedDiv; 

    if($(editedDiv).attr('contenteditable') == 'true') 
    { 
    $(editedDiv).attr('contenteditable','false'); 
    CKEDITOR.instances.id_editedDiv.destroy(); 
    $(this).text('Start Editing'); 
    } 
    else 
    { 
    $(editedDiv).attr('contenteditable','true'); 
    CKEDITOR.inline(id_editedDiv); 
    $(this).text('Finish Editing'); 
    } 
}); 

これが私が結果を達成した方法です。

https://plnkr.co/edit/YUOYGa?p=preview

しかし、今、私は私が保存打ったとき、私の変更がモデルに更新されるようにCKEditorバージョンにモデルをバインドする方法を理解する必要があります。

var content = ''; 

：あなたが好きな何かを行うことができます

$scope.changeInlineEditindState = function() { 
// your code 
} 

：あなたがメソッドを定義する必要がありますCKEditorControllerで

<button type="button" class="inlineEditButton" 
    ng-controller="CKEditorController" 
    ng-click="changeInlineEditindState()" 
</button> 

：

Answer 1

あなたは、例えばNGクリック属性を持つボタンを使用することができますインスタンス作成後にリスナーを追加：

012ボタンのクリックを保存するには

ck.on('instanceReady', function() { 
       ck.setData(content); 
      }); 

：

content = ck.getData(); 

Answer 2

はそれで使用されるすべてのリソースを解放し、エディタインスタンスを破棄します。エディタが要素を置き換えた場合、その要素は復元されます。

お使いのコントローラで

：あなたはhttps://plnkr.co/edit/YUOYGa?p=previewを見れば、私はそれを行う方法を考え出し

alert(CKEDITOR.instances.editor1); // e.g. object 
CKEDITOR.instances.editor1.destroy(); 
alert(CKEDITOR.instances.editor1); // undefined 

More detail