Javascript 用ng repeat或ng model填充textarea,这样它就不会用迭代数据在另一个textarea上创建新的textarea

Javascript 用ng repeat或ng model填充textarea,这样它就不会用迭代数据在另一个textarea上创建新的textarea,javascript,html,angularjs,Javascript,Html,Angularjs,我在尝试使用ng repeat用数据填充单个10行文本区域时遇到问题。相反,它会为每个数据条目创建一个新的文本区域。我怎样才能插入一个?我想让textarea的大小与ng repeat输入的条目数量动态匹配 这是我的js文件 var WaitingRequisitionsController = function($scope, $rootScope, $modal, $window, items) { $rootScope.title = 'Direct Requisitions';

我在尝试使用ng repeat用数据填充单个10行文本区域时遇到问题。相反,它会为每个数据条目创建一个新的文本区域。我怎样才能插入一个?我想让textarea的大小与ng repeat输入的条目数量动态匹配

这是我的js文件

var WaitingRequisitionsController = function($scope, $rootScope, $modal, $window, items) {
    $rootScope.title = 'Direct Requisitions';
    $scope.items = items;

    $scope.formatDate = function (x) {
        return moment(x).format("M/D/YYYY");
    };
};
这是我的html文件,特别是我试图插入的区域

  <div class="row ">
      <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
          <div class="form-group">
              <label>Items</label>
              <div ng-repeat="item in req.items">
                  <textarea ng-model="item.description" class="form-control" type="text" readonly="readonly"></textarea>
              </div>
          </div>
      </div>
  </div>
我的html看起来像这样

            <!-- <div class="row ">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
        <div class="form-group" ng-app>
        <label>Items</label>-->
        <div ng-app>
            <div ng-controller="TodoCtrl">
                <textarea rows={{rows}}  class="form-control" ng-model="myStr" type="text" readonly="readonly"></textarea>
            </div>
        </div>
               <!-- </div>
            </div>
        </div>-->

但如果我把它改成这样,就不会有任何东西出现

我不明白
我需要item.description我不知道这是否与此有关

将项目连接到一个字符串中,用换行符分隔

var WaitingRequisitionsController = function($scope, $rootScope, $modal, $window, items) {

    $rootScope.title = 'Direct Requisitions';

    $scope.items = items
        .map(function (item) {
            return item.description;
        })
        .join('\n');

    $scope.rows = items.length;

    $scope.formatDate = function (x) {
        return moment(x).format("M/D/YYYY");
    };

};
然后可以使用items数组的长度设置文本区域中的行数

<textarea type="text" class="form-controler readonly="readonly" rows="rows"
          ng-model="items">
</textarea>

您正在重复
(要么在自身中,要么通过一个包含
的div
),以便它迭代
项的每个实例。你需要做的是去掉
ng repeat
,并使用
ng model
连接字符串,如的答案所示。

这看起来不错,但我无法调整我的字符串,使其正确。我在角度学习2周后,我的JS文件看起来也不像plnkr上的示例那样模块化。我没有在我的身体标签上声明ng应用程序或ng控制器,该死,我甚至没有身体标签是如何模块化你的代码的一个很好的参考。我把它弄乱了一些,我编辑了我的帖子,这样我就可以告诉你我做了什么。我添加了我的变更来源。还是不行。我需要物品。说明不是硬编码阵列。您可以在阵列上使用地图。请仅返回说明。我已经更新了plunker和示例代码。我试过这样做,但没有任何结果。我需要这些对象的描述部分。我把它弄乱了一些,我编辑了我的帖子,这样我就可以告诉你我做了什么。我添加了我的变更来源。还是不行。我需要物品。说明不是硬编码数组。
var WaitingRequisitionsController = function($scope, $rootScope, $modal, $window, items) {

    $rootScope.title = 'Direct Requisitions';

    $scope.items = items
        .map(function (item) {
            return item.description;
        })
        .join('\n');

    $scope.rows = items.length;

    $scope.formatDate = function (x) {
        return moment(x).format("M/D/YYYY");
    };

};
<textarea type="text" class="form-controler readonly="readonly" rows="rows"
          ng-model="items">
</textarea>