Question

所以我有一个最大长度为100个字符的textarea和一个显示剩余字符的模型数据：

<textarea class="textarea" placeholder="Type here" ng-model="myTextarea" ng-maxlength="100"></textarea>

<span>{{100 - myTextarea.length}}</span>

当我在textarea中输入超过100个字符时，显示的值为100.如何允许显示负数？

当剩余字符数低于0时，如何禁用按钮？像<button ng-disabled="!myTextarea.length > 100">Submit</button>

这样的东西

Answer 1

当你超过ng-maxlength指定的限制时，看起来没有任何东西存储在模型中。您可能需要删除ng-maxlength并手动验证它。

Answer 2

超过限制时，字段模型bocomes为空，因为它不再有效。所以你能做的就是：

<form name="myForm">
    <textarea class="textarea" placeholder="Type here" name="myTextarea" ng-model="myTextarea" ng-maxlength="10"></textarea>
    <div>
        Remainging: <span ng-bind="10 - (myForm.myTextarea.$valid ? myTextarea.length : 10)"></span>
    </div>
    <button ng-disabled="myForm.myTextarea.$error.maxlength">Send</button>
</form>

AngularJS ng-bind不显示负数

2 个答案:

演示：http://plnkr.co/edit/3VONar0zNp8lRfFsqZDC?p=preview