如何为textarea创建一个字符计数器？ （角） [英] How to create a character counter for textarea ? (angular)
本文介绍了如何为textarea创建一个字符计数器？ （角）的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
< label class =control-labelfor =content> Content< / label>
<！ - counter - >
< br>
< span class =form-help> {{1400-vm.article.content.length}}
字符< / span>
< div ng-messages =vm.form.articleForms.content。$ errorrole =alert>
< p class =help-block error-textng-message =required>文章标题为必填项。< / p>
< / div>
< / div>
状态：
我试图在提交时显示一条错误消息，如果字数过低并显示ng-messages：错误消息不会出现。
我也试图实时更新文本区域的字数。它没有更新。
我做错了什么？
参考文献：
PS：
我正在使用mean.js
解决方案
p>
< script src =https://ajax.googleapis.com/ajax /libs/angularjs/1.2.12/angular.min.js\">< ;; script><; ng-app> < div class =form-group> < label class =control-labelfor =content> Content< / label> < textarea name =contentdata-ng-model =vm.article.contentid =contentclass =form-controlcols =30rows =10placeholder =1400字符长最少要求ng-maxlength =1400突出显示错误>< / textarea> <！ - 反 - > <峰; br> < span class =form-help> {{1400-vm.article.content.length}}字符< / span> < div ng-messages =vm.form.articleForms.content。$ errorrole =alert> < p class =help-block error-textng-message =required>文章标题为必填项。< / p> < / DIV> < / DIV> < / body>
CODE:
<div class="form-group">
<label class="control-label" for="content">Content</label>
<textarea name="content" data-ng-model="vm.article.content" id="content" class="form-control" cols="30" rows="10" placeholder="1400 characters long at least" required ng-minlength="1400" ng-maxlength="14000" highlight-on-error></textarea>
<!--counter-->
<br>
<span class="form-help">{{1400-vm.article.content.length}}
Characters</span>
<div ng-messages="vm.form.articleForms.content.$error" role="alert">
<p class="help-block error-text" ng-message="required">Article title is required.</p>
</div>
</div>
SITUATION:
I am trying to display an error message on submit if word count is too low with ng-messages: the error message does not appear.
I am also trying to update in real-time a word count of the text area. It doesn't udate.
What have I done wrong ?
REFERENCE:
angularjs text area character counter
P.S.:
I am using mean.js
解决方案
Working fine :
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<body ng-app>
<div class="form-group">
<label class="control-label" for="content">Content</label>
<textarea name="content" data-ng-model="vm.article.content" id="content" class="form-control" cols="30" rows="10" placeholder="1400 characters long at least" required ng-maxlength="1400" highlight-on-error></textarea>
<!--counter-->
<br>
<span class="form-help">{{1400-vm.article.content.length}}
Characters</span>
<div ng-messages="vm.form.articleForms.content.$error" role="alert">
<p class="help-block error-text" ng-message="required">Article title is required.</p>
</div>
</div>
</body>
这篇关于如何为textarea创建一个字符计数器？ （角）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
