AngularJS 부분에서 새 줄을 어떻게 보존 할 수 있습니까?

AngularJS 부분에서 새 줄을 어떻게 보존 할 수 있습니까?

---

AngularJS 부분 내에서 다음과 같이 항목 목록을 반복합니다.

<ul class="entries">
    <li ng-repeat="entry in entries">
        <strong>{{ entry.title }}</strong>
        <p>{{ entry.content }}</p>
    </li>
</ul>

의 내용에는 {{entry.content}}AngularJS에서 무시되는 일부 줄 바꿈이 있습니다. 줄 바꿈을 유지하려면 어떻게해야합니까?

---

기본적인 HTML 일뿐입니다. AngularJS는 그것에 대해 아무것도 변경하지 않습니다. pre대신 태그를 사용할 수 있습니다 .

<pre>{{ entry.content }}</pre>

또는 CSS를 사용하십시오.

p .content {white-space: pre}

...

<p class='content'>{{ entry.content }}</p>

entry.contentHTML 코드가 포함 된 경우 다음을 사용할 수 있습니다 ng-bind-html.

<p ng-bind-html="entry.content"></p>

ngSanitize 를 포함하는 것을 잊지 마십시오 .

var myModule = angular.module('myModule', ['ngSanitize']);

---

나는 필터를 만든다

// filters js
myApp.filter("nl2br", function($filter) {
 return function(data) {
   if (!data) return data;
   return data.replace(/\n\r?/g, '<br />');
 };
});

그때

// view
<div ng-bind-html="article.description | nl2br"></div>

---

다음을 추가하여 수정합니다 pre-line.

<style>
    pre{
        white-space: pre-line;
    }
</style>
My data:
 <pre>{{feedback.Content}}<pre>

---

// AngularJS filter
angular.module('app').filter('newline', function($sce) {
    return function(text) {
        text = text.replace(/\n/g, '<br />');
        return $sce.trustAsHtml(text);
    }
});

// HTML
<span ng-bind-html="someText | newline"></span>

참고 URL : https://stackoverflow.com/questions/15449325/how-can-i-preserve-new-lines-in-an-angularjs-partial