Question

我有两个textareas字段。

一旦用户填充了第一个文本区域“ A”，则应将第二个文本区域“ B”作为默认值，即来自文本区域“ A”本身的值。但是，用户可以在编辑模式下编辑textarea B的值。第二个文本区域“ B”默认情况下不显示，只有当文本区域B出现在编辑操作上时，用户才可以添加修改其自身值的标签B代表文本区域A的值。由于第二个文本区域B为空，因此无法将其设置为默认值。第二件事，如果用户不编辑，它应该能够将标签B的值保存为textarea B的默认值。

TEXTAREA "A"
<textarea id="@Model.Id" class="order-message" rows="2" cols="20"
          ng-model="message" order-message ng-maxlength="380">
</textarea>

LABEL B 
<p ng-show="showDescriptionLabel">{{archiveMetadescription}}</p>

<a ng-click="editDescription(message)"  class="edit-btn needsclick">
  <i class="fa fa-edit"></i>
</a>

TEXTAREA "B"
<textarea ng-show="!showDescriptionLabel" id="@Model.Id"
          ng-init="archiveMetadescription= {{message}}"
          class="metadescription" rows="2" cols="20"
          ng-model="archiveMetadescription"  >
</textarea>

在我的控制器中，我尝试在初始化函数中将textarea B设置为textarea A

 $scope.archiveMetadescription = angular.copy($scope.message);

$scope.editDescriptiom = function (val) {
    $scope.archiveMetadescription = angular.copy(val);
    $scope.showDescriptionLabel = false;
}

但是标签B没有值，因为文本区域B的值尚未初始化，并且在编辑时，标签应消失，从而文本区域B以文本区域A的值显示。

Answer 1

请勿使用ng-init。这是一次性操作，仅在AngularJS框架编译元素时才会发生：

TEXTAREA“ B”

<textarea ng-show="!showDescriptionLabel" id="@Model.Id"
          ̶n̶g̶-̶i̶n̶i̶t̶=̶"̶a̶r̶c̶h̶i̶v̶e̶M̶e̶t̶a̶d̶e̶s̶c̶r̶i̶p̶t̶i̶o̶n̶=̶ ̶{̶{̶m̶e̶s̶s̶a̶g̶e̶}̶}̶"̶
          class="metadescription" rows="2" cols="20"
          ng-model="archiveMetadescription"  >
</textarea>

请勿将angular.copy与字符串基元一起使用：

$scope.editDescription = function (val) {
    ̶$̶s̶c̶o̶p̶e̶.̶a̶r̶c̶h̶i̶v̶e̶M̶e̶t̶a̶d̶e̶s̶c̶r̶i̶p̶t̶i̶o̶n̶ ̶=̶ ̶a̶n̶g̶u̶l̶a̶r̶.̶c̶o̶p̶y̶(̶v̶a̶l̶)̶;̶
    $scope.archiveMetadescription = val;
    $scope.showDescriptionLabel = false;
}

Answer 2

@georgeawg非常感谢您的帮助和回复。我终于在$ scope.message上做了一块手表，它现在可以工作了，即使用户编辑或不编辑标签B，我也可以保存archiveMetadescription。

In my controller
$scope.$watch(
          function () { return $scope.message },
           function (newValue, oldValue) {

              $scope.archiveMetadescription = $scope.message;
          }, true);

        $scope.editDescription = function (val) {
            $scope.archiveMetadescription = val;
            $scope.showDescriptionLabel = false;
        }

In my view  
LABEL B
<p ng-show="showDescriptionLabel">{{archiveMetadescription }}</p>
<text><a ng-click="editDescription(archiveMetadescription )" class="edit-btn needsclick"><i class="fa fa-edit"></i></a></text>

TEXTAREA B
<textarea ng-show="!showDescriptionLabel" id="@Model.Id"
          class="metadescription" rows="2" cols="20"
          ng-model="archiveMetadescription"  >
</textarea>



TEXTAREA "A"
<textarea id="@Model.Id" class="order-message" rows="2" cols="20"
          ng-model="message" order-message ng-maxlength="380">
</textarea>

如何设置第二文本区域B的默认值，从而使用angular从第一文本区域A获得默认值

2 个答案: