Angular.js: Как хранить содержимое div HTML в переменной области видимости

У меня есть редактируемый div, и я хочу сохранить содержимое HTML в переменной scope scope.myText:

<div id="editor" contenteditable="true" ng-model="myText"> <p>HTML Text</p>
</div>

Как это сделать в Angular? Есть ли какая-либо директива для решения этой проблемы? Я ценю любую помощь, спасибо.

2 ответа

Я нашел решение этой проблемы, используя директиву ng-blur:

Контроллер:

$scope.updateModel = function(){ $scope.myText = angular.element(editor).html(); //if you are using jquery use this line: //$scope.myText = $('#editor').html();
};

Если вы хотите инициализировать содержимое редактора, используйте это:

angular.element(editor).html('<p>initial content</p>');
//thanks to @PatrickGrimard

или с помощью jquery:

$('#editor').html('<p>initial content</p>');

Вид:

<div id="editor" contenteditable="true" data-ng-blur="updateModel()"> <p>HTML Text</p>
</div>
{{myText}}


Почему бы не использовать текстовое поле внутри своего div вместо этого, вы можете просто использовать ng-model на нем.

licensed under cc by-sa 3.0 with attribution.