Angularjs textarea不处理换行符

时间:2014-09-08 07:21:32

标签: javascript php html angularjs

我有以下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>

我的js控制器内部如下:

   $scope.updateComments = function()
     {


        $http({
            method: 'POST',
            url: '/create_comment/' + $scope.id+ '?comments=' + $scope.comments,
        })
        .success(function(data){
            $('#myModalComment').modal('hide');



        })


     }

问题是每当我从textarea输入处理换行符时,它都不会处理它。

例如,如果我想键入以下行:

 first line
 second line

我的输出结果如下:

第一个linesecond线

我如何迎合这个问题?

更新:

如果这可能是PHP密码html字符的后端问题,这里是我的php控制器中的函数:

 public function createComments($id)
 {
    $comments = Input::get('comments');
    $log= Logger::find($id);
    $log->comments= $comments;
    $log->save();

 }

2 个答案:

答案 0 :(得分:4)

如果我理解你的话,问题就在于以下几点:

 <textarea id="txtArea" rows="10" cols="50" 
    ng-model="$parent.comments" type="text"  ng-trim="false"></textarea>
 {{comments}}

{{comments}}未显示换行符。

但这是自然的HTML行为。还有自然的HTML解决方案 <pre>

 <textarea id="txtArea" rows="10" cols="50" 
    ng-model="$parent.comments" type="text"  ng-trim="false"></textarea>
 <pre>{{comments}}</pre>

请参阅http://www.w3schools.com/tags/tag_pre.asp

  

<pre>标记用于定义预先格式化的文本。

     

<pre>元素中的文本以固定宽度字体(通常为Courier)显示,并保留空格和换行符。

答案 1 :(得分:2)

$scope.$watch('$parent.comments', function(newVal) {
    var newVal= newVal.replace(/\r?\n/g, '<br />');
    $scope.$parent.comments = newVal;
},true);  

尝试这样的事情:)