html - 通过 Angularjs 更新文本区域行

Question

我想调整 textArea 中的行数，重点放在模糊时删除它们。此外，在聚焦时我想显示一个隐藏的 div 层。我目前的解决方案是

<textarea class="form-control" rows="1" placeholder="Please enter text..." 
onfocus="this.rows=3" ng-focus="isVisible = !isVisible" onblur="this.rows=1" 
ng-blur="isVisible = !isVisible"></textarea>

正如您从上面看到的，我必须使用两个属性，即 HTML onfocus 来增加行数和 ng-focus 来更新 isVisible(显示和隐藏 div)。它有效，但我想知道是否可以仅使用 ng-focus 和 ng-blur 来增加和减少行数。

我正在显示和隐藏的div层

<div class="row" ng-show="isVisible" />

提前致谢

Answer 1

基本上，您可以使用 ng-attr-rows 来动态设置 rows 属性值。你可以有类似下面的东西。

基本上在每个摘要周期ng-attr-*指令评估其表达式，在您的情况下 * 是 rows，并将评估的值添加到 rows 属性。

标记

<textarea ng-model="test" 
   ng-attr-rows="{{row || '1'}}" 
   ng-focus="row=3" 
   ng-blur="row=1">
</textarea>

Demo Plunkr