Angular Текстовая область Counter Line Breaks SMS

Я пытаюсь создать счетчик персонажей, который имитирует телефон для . У меня есть счетные символы, пробелы и разрывы строк, однако мои счетчики различаются. При разрыве строк он уменьшается на 1 в счетчике для message.length, но делает более одного в maxlength. Я думаю, что добавлено больше пробелов с отступом, но не уверен, как установить message.length так же, как maxlength.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app>
  <textarea ng-model="message" ng-trim="false" maxlength="160"></textarea>
  <span>{{160 - message.length}} left</span>
</body>

Ответ 1

Итак, единственное, что вам нужно считать двумя символами, - это фактические разрывы строк (разрывы строк, введенные вручную пользователем, а не "виртуальные" разрывы строк, вызванные тем, что текст длиннее ширины текстовой области)?

Тогда Id предложит следующее:

<span>{{160 - message.length - (message.length ? message.split("\n").length-1 : 0)}} left</span>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app>
  <textarea ng-model="message" ng-trim="false" maxlength="160"></textarea>
  <span>{{160 - message.length - (message.length ? message.split("\n").length-1 : 0)}} left</span>
</body>

Ответ 2

Вы можете заменить символы новой строки строкой длиной 2 перед оценкой длины следующим образом:

<span>{{160 - message.replace('\n', '--').length}} left</span>

см. эту скрипку (я уменьшил максимальную длину в скрипте до 10 для более легкого тестирования):

http://jsfiddle.net/9DbYY/307/