Новый выпуск строки в angularjs

Question

У меня есть форму в AngularJS. В форме у меня есть поле с именем «description». Если пользователь вводит описание как:

"Это описание:

1) пункт 1

2) пункт 2"

Я спасаю это как:

"This is description:<br/>1)point 1 <br/> 2)point 2" 

Теперь, сохранив его, чтобы показать его на странице, я использую что-то вроде:

<span class="summary"><em ng-bind-html="(x.DES)"></em></span> 

Этот код работает.

Если пользователь нажимает на записи, то я загружающая форму в режиме редактирования:

форма, имеющая линию в режиме редактирования, чтобы показать описание:

<textarea ng-focus="onFocusDescrption()" maxlength="600" name="cepDes" class="form-control" rows="3" cols="16" ng-model="description" ng-disabled="isDescDisable" placeholder="Enter a description ..." id="description"></textarea> 

Теперь проблема приходит сюда. В контроллере я устанавливаю значение модели как:

$scope.description = $scope.timeEntry.DES; 

Где в $ scope.timeEntry.DES оказывает значение, которое сохраняется. Значение отображается в textarea, имеющем
.

Пожалуйста, помогите мне.

Answer 1

Невозможно использовать разметку в текстовом поле, как вы можете видеть в этом plunkr. Я создал и больше информации в этом post. Решением было бы использовать директиву, которая допускает редактируемый контент. Таким образом, вы можете использовать DIV для отображения и редактирования:

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

Директива (также on github):

app.directive("contenteditable", function() { 
    return { 
    restrict: "A", 
    require: "ngModel", 
    link: function(scope, element, attrs, ngModel) { 

     function read() { 
     ngModel.$setViewValue(element.html()); 
     } 

     ngModel.$render = function() { 
     element.html(ngModel.$viewValue || ""); 
     }; 

     element.bind("blur keyup change", function() { 
     scope.$apply(read); 
     }); 
    } 
    }; 
});