Angular2 FormArray - 在页面上显示textarea字符数 - 如何?

时间:2017-02-03 03:20:16

标签: angular

我想在FormArray中显示每个textarea元素的字符数。

这就是我所拥有的。看不到使用索引或动态创建唯一本地变量名称的方法,我目前拥有alocalname占位符,以获得我想要的内容。我怎么能这样做。

<div class="list-group" formArrayName="texts">
   <div class="row"
     *ngFor="let text of profileForm.controls['texts'].controls; let i = index;">
       <div formGroupName="{{i}}">
          <div>
            <textarea type="text" class="form-control" formControlName="text" #alocalname></textarea>
            <small class="form-text text-muted"><code>{{alocalname.value.length}}</code> of characters</small>
        </div>          
      </div>
   </div>
</div>

1 个答案:

答案 0 :(得分:2)

您只需访问您正在迭代的每个control的值。

所以text.get('text').value.length应该有用。

<div class="list-group" formArrayName="texts">
   <div class="row"
     *ngFor="let text of profileForm.get('texts').controls; let i = index;">
       <div [formGroupName]="i">
          <div>
            <textarea type="text" class="form-control" formControlName="text"></textarea>
            <small class="form-text text-muted"><code>{{text.get('text').value.length}}</code> of characters</small>
        </div>          
      </div>
   </div>
</div>