角入力で改行を維持する方法

Question

私が意図していない動作に気付いています。私は<textarea>を持っています。私は下のようにテキストを入力できます。

some content 
some other content 
yet another content 

私は私が得るもの、JSONオブジェクトにこのテキストを保存し、それを格納しています：

"value" : "some content 
some other content  
yet another content" 

：また

"value" : "some content some other content yet another content" 

、私は時々これを取得します私が何をしてきたかは、を受け取ることを期待しては

"value" : "some content \n 
    some other content \n  
    yet another content" 

このようにして、入力したのと同じ方法でコンテンツを表示できます。

しかし、これは私のJSON.parse(string)を破るようです。 入力のモデルにはAngluarJSを使用しています。

EDIT：

これは私がJSONバリデータで私のオブジェクトを置けば何が起こるかです：

Answer 1

あなたがしようとすると何か他のものに改行文字を置き換えることができます。 改行文字がJSON.parseで問題を引き起こしている場合は、<br/>のようなものに置き換えてください。データを取得するときに改行のように動作します。

あなたはまた、目に見える改行文字をJSON文字列にあなたのtextarea値を変換する必要がありJSON.parseを使用する前にtextarea値にJSON.stringifyを試みることができます。

document.getElementById("textarea-id").value.replace(/\n\r?/g, '<br />') 

OR

JSON.stringify(document.getElementById("textarea-id").value) 

以下の例ではconsole.log年代を参照してください： https://jsfiddle.net/fjj2psqj/1/

Answer 2

// valid JSON 
var data = { 
    "value": [ 
     "line", 
     "line", 
     "line" 
    ] 
}; 

// stringify the data to save it as text 
var dataString = JSON.stringify(data); 

// parse the string and join the array to recover line breaks 
// or iterate over values array depending on your use case 
var withNewLines = JSON.parse(dataString).value.join("\n"); 

Answer 3

あなたはそれを送信する前にJSON.stringifyを通して、あなたのキャプチャテキストエリアの文字列を実行することができ

あなたのアプリケーションに再び使用する前にそれをJSON.parseしてください。

$scope.doSomethingWithTextareaText = function() { 
    //assuming your textarea is bound to $scope.text 
    $scope.myObject['value'] = $scope.text; 
    $scope.myObject['stringifyValue'] = JSON.stringify($scope.text); 
    /* 
     $scope.myObject[value]: 
     some content 
     some other content 
     yet another content 
     $scope.myObject[stringifyValue]: 
     "some content\nsome other content\nyet another content" 
     JSON.parse($scope.myObject[stringifyValue]): 
     some content 
     some other content 
     yet another content 
    */ 
} 

http://jsfiddle.net/5d2oekv0/3/を参照してください。