[英]Angularjs textarea not processing line breaks
I have the following html: 我有以下html:
<div class="form-group">
<div class="input-group col-sm-12">
<label for="" class="control-label">Comments</label>
<div class="controls">
<textarea id="txtArea" rows="10" cols="50" ng-model="$parent.comments" type="text" ng-trim="false"></textarea>
{{comments}}
</div>
</div>
</div>
Inside my js controller is the following: 在我的js控制器内部是以下内容:
$scope.updateComments = function()
{
$http({
method: 'POST',
url: '/create_comment/' + $scope.id+ '?comments=' + $scope.comments,
})
.success(function(data){
$('#myModalComment').modal('hide');
})
}
Problem is that whenever I process line breaks from the textarea input, it doesn't process it. 问题是,每当我处理textarea输入中的换行符时,它都不会处理。
For example if I want to type the following line: 例如,如果我想输入以下行:
first line
second line
My output would like like this: 我的输出想要这样:
first linesecond line 第一行第二行
How do I cater to this problem? 我该如何解决这个问题?
UPDATE: 更新:
In case this maybe a back end issue where PHP esacpes the html characters, here is my function inside my php controller: 万一这可能是PHP掩盖html字符的后端问题,这是我的php控制器内部的函数:
public function createComments($id)
{
$comments = Input::get('comments');
$log= Logger::find($id);
$log->comments= $comments;
$log->save();
}
If I do understand you correctly, the issue is in these lines: 如果我确实正确了解您,则问题可能出在以下几行:
<textarea id="txtArea" rows="10" cols="50"
ng-model="$parent.comments" type="text" ng-trim="false"></textarea>
{{comments}}
that the {{comments}}
is not showing line breaks. {{comments}}
未显示换行符。
But that's natural HTML behaviour. 但这是自然的HTML行为。 And there is also natural HTML solution <pre>
: 还有自然的HTML解决方案<pre>
:
<textarea id="txtArea" rows="10" cols="50"
ng-model="$parent.comments" type="text" ng-trim="false"></textarea>
<pre>{{comments}}</pre>
see http://www.w3schools.com/tags/tag_pre.asp : 参见http://www.w3schools.com/tags/tag_pre.asp :
The
<pre>
tag defines preformatted text.<pre>
标记定义预格式化的文本。Text in a
<pre>
element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks.<pre>
元素中的文本以固定宽度的字体(通常是Courier)显示,并且保留空格和换行符。
$scope.$watch('$parent.comments', function(newVal) {
var newVal= newVal.replace(/\r?\n/g, '<br />');
$scope.$parent.comments = newVal;
},true);
try something like this :) 尝试这样的事情:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.