当它无效时,如何防止AngularJS从模型中解除表单输入值的绑定？

Question

我正在使用AngularJS构建一个表单,我注意到一些我不理解的行为.

当我指定ng-minlength=5为输入属性时,AngularJS会取消绑定该值,直到它超过所需值.

这对我来说很不方便,因为我想告诉用户他们输入了多少内容user.lifestory.length.

为什么AngularJS以这种方式工作？如何防止Angular在无效时解除绑定值？

<label for="lifeStory">Life story:<input name='lifeStory' type="text" ng-model='user.lifeStory' ng-minlength='5' required></input></label>

这方面的一个例子是:http://jsfiddle.net/J67jm/3/

你可以通过填写生活故事领域来看到我正在谈论的行为.

Answer 1

您可以用来{{myForm.lifeStory.$viewValue}}获取 lifeStory 的当前 viewValue （尚未绑定到模型）。这是解决您的问题的示例代码。

<span>Your life story needs to be at least 5 characters. You have entered {{myForm.lifeStory.$viewValue.length}} charaters.</span>

参考jsfiddle版本 - http://jsfiddle.net/J67jm/9/