Angular.js：如何在范圍變量中存儲div HTML內容

Question

我有一個可編輯的div ，我想將HTML內容存儲在scope變量scope.myText ：

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

我怎么能在Angular中做到這一點？ 有沒有解決這個問題的指令？ 我感謝任何幫助，謝謝。

Answer 1

我使用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}}

Answer 2

為什么不在div中使用textarea，那么你可以在它上面使用ng-model。