Question

我正在使用angularjs制作SPA。

单击“确定”按钮后，我的对象将被序列化为JSON字符串并显示在textarea控件中。

这是我的代码：

HTML：

<div id="resultModal" class="modal fade" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Result</h4>
            </div>
            <div class="modal-body">
                    <textarea class="form-control"
                              readonly="readonly"
                              rows="10">
                        {{serializedInfo}}
                    </textarea>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

我的部分JS代码：

$scope.CreateFoodInfo = function (shownModal) {
                $scope.serializedInfo = angular.toJson($scope.food);
                $(shownModal).modal("show");
            }

但最后，我有了这个：

我的textarea里面有多余的空间。

任何人都可以帮我解决这个问题吗？

我正在使用

JQuery 2.2.1
AngularJs 1.5.0

Answer 1

textarea中有额外的空格：

<textarea class="form-control"
    readonly="readonly"
    rows="10">{{serializedInfo}}</textarea>

话虽如此，你可能会更好地使用ng-model

<textarea class="form-control"
        readonly="readonly"
        rows="10"
        ng-model="serializedInfo"></textarea>

Textarea在与AngularJS模型绑定后具有冗余空间

1 个答案: