Enable and disable CKEditor Inline editing using Angular - angularjs

Question

How can I enable or disable ckeditor.inline on a div based on a click of a button/link.
This is how I would achieve it in jquery but can't figure it out using angular.
$('.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');
}
});
This is how I achieved the result.
https://plnkr.co/edit/YUOYGa?p=preview
But now I need to figure out how to bind the model to the CKEditor so that my changes are updated in the model when I hit save.

Answer 1

Destroys the editor instance, releasing all resources used by it. If the editor replaced an element, the element will be recovered.
In your controller:
alert( CKEDITOR.instances.editor1 ); // e.g. object
CKEDITOR.instances.editor1.destroy();
alert( CKEDITOR.instances.editor1 ); // undefined
More detail

Answer 2

You can use button with ng-click attribute for example:
<button type="button" class="inlineEditButton"
ng-controller="CKEditorController"
ng-click="changeInlineEditindState()"
</button>
in CKEditorController you should define method:
$scope.changeInlineEditindState = function() {
// your code
}
You can do something like:
var content = '';
After instances creation add listener:
ck.on('instanceReady', function () {
ck.setData(content);
});
On save button click:
content = ck.getData();