title: AngularJS textarea newline on enter key
body: <p>I am developing an AngularJS application same like how we post answers and questions on stackoverflow and we get live preview of our answers or question just below the textarea.</p>
  
  <p>Here is my trial code:</p>
  
  <p><strong>index.html-</strong></p>
  
  <pre><code>&lt;div ng-app="bindHtmlExample" ng-controller="ExampleController"&gt;
          &lt;textarea ng-model="myHTML"&gt;&lt;/textarea&gt;
          &lt;div ng-bind-html="myHTML"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>script.js-</strong></p>
  
  <pre><code>(function(angular) {
    'use strict';
  angular.module('bindHtmlExample', ['ngSanitize'])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.myHTML =
         'I am an &lt;code&gt;HTML&lt;/code&gt;string with ' +
         '&lt;a href="#"&gt;links!&lt;/a&gt; and other &lt;em&gt;stuff&lt;/em&gt;';
    }]);
  })(window.angular);
  </code></pre>
  
  <p>When user types anything in the textarea, user can see live preview of what he/she is typing in the <code>&lt;div ng-bind-html="myHTML"&gt;&lt;/div&gt;</code>.
  When user types any HTML code, it will show real HTML output.</p>
  
  <p>I have done upto this.</p>
  
  <p>So, my problem is when user presses <code>enter key</code> in textarea, <strong>newline</strong> must get started in <code>&lt;div ng-bind-html="myHTML"&gt;&lt;/div&gt;</code>.</p>
  
  <p>How do I do that?</p>
  
  <p>Here is the <a href="http://i.stack.imgur.com/xFD94.png" rel="nofollow">Screenshot</a> of my wordpress website, you will get an idea what exactly I want...</p>