【问题标题】:Angularjs textarea not processing line breaksAngularjs textarea不处理换行符
【发布时间】:2014-11-01 08:56:51
【问题描述】:

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

我的输出是这样的:

第一行第二行

我该如何解决这个问题?

更新:

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

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

 }

【问题讨论】:

    标签: javascript php html angularjs


    【解决方案1】:
    $scope.$watch('$parent.comments', function(newVal) {
        var newVal= newVal.replace(/\r?\n/g, '<br />');
        $scope.$parent.comments = newVal;
    },true);  
    

    试试这样的:)

    【讨论】:

    • 当我输入时:第一秒我得到一个错误:语法错误:标记“第二”是表达式 [第一秒] 的第 7 列中的意外标记,从 [秒] 开始。
    【解决方案2】:

    如果我的理解正确,问题出在以下几行:

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

    {{comments}} 没有显示换行符。

    但这是自然的 HTML 行为。而且还有天然的HTML解决方案&lt;pre&gt;

     <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:

    &lt;pre&gt; 标签定义了预格式化的文本。

    &lt;pre&gt; 元素中的文本以固定宽度字体(通常是 Courier)显示,并且保留空格和换行符。

    【讨论】:

    • 嗨,{{comments}} 实际上只是预览输入到文本区域的内容。如果我输入新的换行符,使用&lt;pre&gt;&lt;/pre&gt; 将显示正确的输出,但在执行updateComments() 并将其插入我的数据库后,换行符消失了。
    • 我看到您将评论作为 url 参数传递。您不能将其作为 JSON 发送吗?或 FORM 之类的(键/值对) - 只是在 POST 请求 BODY 中。在我看来,该网址没有对换行符进行编码......
    • @user3278616,你试过这个吗:$log-&gt;comments= nl2br($comments);
    猜你喜欢
    • 2014-08-16
    • 2011-09-13
    • 2013-08-18
    • 2011-11-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多