Значения по умолчанию для textarea отсутствуют после использования ng-model

У меня есть приложение 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... и т.д. загружаются по умолчанию. Однако, когда я представляю ng-модель для доступа к этим данным следующим образом, значения по умолчанию больше не отображаются. Что может произойти?

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

Ответы

Ответ 1

Из docs:

ngModel попытается связать с этим свойством значение, оценивающее выражение в текущей области. Если свойство еще не существует в этой области, оно будет создано неявно и добавлено в область.

Итак, что происходит здесь со следующим кодом:

<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 на вашем контроллере:

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

Ответ 2

Более чистый способ сделать это (используя только angular):

На ваших контроллерах:

$scope.item = {'mytextvalue' : 'John,2 Jane,3 John,4 Jane,5'};

на ваш взгляд:

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

Надеюсь, что это поможет!