ng-minlength和ng-pattern阻止绑定

Question

我将输入字段定义为

<form name="signUpForm">
<input type="text" name="username" ng-minlength="8" ng-maxlength="64" ng-model="user.username" ng-pattern="/((?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[@#$%^]))/">
</form>

并将控制器中的用户定义为

$scope.user{};

现在，当我在超文本标记语言中绑定user.username值时，它会阻止它。

<p ng-if="user.username.length > 0">Display True</p>

即使我简单地将它在HTML中的值绑定为

{{user.username}}

它没有被显示。

现在如果我从输入字段中删除ng-pattern，如下所示：

<input type="text" ng-minlength="8" ng-maxlength="64" ng-model="user.username">

然后只有它的绑定，并且在满足ng-minlength="8“条件之后也是如此。表示显示“12345678”，而不显示“1234567”。

还有一个问题，即如果我使用ng-pattern，那么ng-minlength验证就不起作用了。

<p ng-if="signUpForm.username.$error.minlength">Please enter minimum length</p>

Answer 1

您可以尝试设置form.$setViewValue.length而不是模型的长度

例如：

<p ng-if="signUpForm.username.$setViewValue.length > 0">Display True</p>

这是我找到的一个解决方案：How do I prevent AngularJS from unbinding a form input's value from its model when it's invalid?