Angular - 在没有 jQuery 的情况下将行号添加到文本区域

Question

我正在尝试将行号添加到 textarea，而我找到的唯一选项是基于 jQuery，对于 exapmle。有没有办法只使用 angular 而不是纯 CSS/JS？

谢谢。

Answer 1

当然，这应该不是问题。一种解决方案可能是使用 ng-repeat 在文本区域旁边创建小的行号 div。像这样：

  <div class="line-numbers">
      <div ng-repeat="i in getNumber(number)">{{$index+1}}</div>
  </div>
  <div class="text-area">
    <textarea rows="5" cols="50"></textarea>
  </div>

在你的控制器中：

  $scope.number = 5;
  $scope.getNumber = function(num) {
    return new Array(num);
  }

一些 CSS 帮助他们坐在一起：

.line-numbers {
  display: inline-block;
  font-family: fixed-width;
  margin: 0px;
}

.text-area {
  display: inline-block;
  margin: 0px;
}

祝你好运！

Angular - 在没有 jQuery 的情况下将行号添加到文本区域

Angular - Add line number to teaxtarea without jQuery

textarea

angularjs