angularjs - 使用 ng-model 后缺少 textarea 的默认值

Question

我有一个 Angular 应用程序，我在其中使用如下文本框:

    <div class="panel-body text-center">
        <textarea id="mytext" class="form-control" rows="4">John,2
    Jane,3
    John,4
    Jane,5
        </textarea>
    </div>

这里默认加载值 John,2...etc。但是，当我按如下方式引入 ng-model 来访问此数据时，默认值不再显示。可能会发生什么？

<textarea id="mytext" ng-model="mytextvalue" class="form-control" rows="4">

Answer 1

来自 docs :

ngModel will try to bind to the property given by evaluating the expression on the current scope. If the property doesn't already exist on this scope, it will be created implicitly and added to the scope.

那么下面的代码发生了什么:

<textarea ng-model="mytextvalue" >...</texarea>

当 ng-model指令被处理，它会寻找一个属性 mytextvalue在 $scope .如果找不到，它将创建一个空值，然后继续将该空值分配给您的元素。

如果要默认值，则必须明确指定 mytextvalue 的值。

您可以在 中执行此操作HTML 与 ng-init

ng-init="mytextvalue='John,2\nJane,3\nJohn,4\nJane,5'"

或者您可以使用 JavaScript 在您的 Controller 上:

$scope.mytextvalue = 'John,2\nJane,3\nJohn,4\nJane,5';