web-dev-qa-db-ja.com

angularで改行/ nを改行に変換する

改行文字/ nを含む文字列があります。表示しようとしています

文字列。/nを新しい行として受け取る代わりに、「/ n」をテキストとして表示します。

   $scope.myOutput = " Hello /n"

    {{ myOutput | textFormat }}

必須->こんにちは（HTMLページ上）

試した：

 app.filter('textFormat', function() {
    return function(x) {
      return x.replace(/\\n/g, '<br/>');
   }

ホワイトスペースのようなCSSスタイルを試してみました：pre;

cssangularjswhitespaceangular-filterslinefeed
6
Rk R Bairi

これは置き換えられませんが、CSS属性white-space: pre-line;を使用して、ブラウザーで\ nをレンダリングできます： https://developer.mozilla.org/en-US/docs/Web/CSS /空白

div {
  white-space: pre-line;
}
<div>Foo
   Bar
       Baz     Foo
     Bar
 


     
  Baz
</div>
16
Tim Schoch

1-次の方法でフィルターを書き換えます。

.filter('textFormat', function() {
    return function (x) {
      return x.replace(new RegExp('\/n', 'g'), '<br/>');
    }
 })

2-あなたのhtmlでは次の構文を使用する必要があります：

<span ng-bind-html="myOutput | textFormat"></span>

ここで、myOutputは$scope.myOutput = ' Hello /n'

0
Vadim Shashkov