AngularJS Render HTML in textarea

Question

I need to render HTML values in text area SUBMIT FORM. I can bind the html values in a <div> but not in a <textarea>. Also, ng-model for data binding can retrieve the value but it is displayed as html.

Controller

//task.descr contains "<br>-------<br><a href="http://www.google.com"..."
var str="<br><hr><br>"+ task.descr;
//str= $sce.trustAsHtml(str);
$scope.formData5 = {
    descr: str}
console.log($scope.formData5);


<textarea placeholder="Deskripsi Memo"  name="descr" 
ngMaxlength="1000" ng-model="formData5.descr" 
ng-bind-html="formData5.descr" > </textarea>

if not using text area,what is the best way to render the HTML values as well as for ng-model? — xyonme
– xyonme, Commented Mar 7, 2015 at 4:24
use contenteditable for the div and achieve the same result :) — mohamedrias
– mohamedrias, Commented Mar 7, 2015 at 4:48

mohamedrias · Accepted Answer · 2015-03-07 04:42:27Z

5

This would allow you have both two way data binding as well as give you the functionality of textarea:

  <div ng-bind-html="modelname"
         contenteditable="true"
         ng-model="modelname">
    </div>

DEMO

answered Mar 7, 2015 at 4:42

mohamedrias

18.6k3 gold badges41 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Badarinath Pennati Over a year ago

I think content editable is a special directive. Please refer to: fdietz.github.io/recipes-with-angular-js/…

Shyamal Parikh Over a year ago

Two way data binding doesn't work. Add <p>{{inputText}}</p> and check

Collectives™ on Stack Overflow

AngularJS Render HTML in textarea

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related