Question

我想用自定义js函数验证表单＆＃34; isValid＆＃34;。我做了这样的事情：

<input id="pricecondition" name="pricecondition" ng-model="user.pricecondition" ng-focus="user.pricecondition=''" required />

<button ng-click="submit()" ng-disabled="form.$invalid && user.isValid">submit</button>

但似乎ng-disabled仅调用user.isValid一次。

这是我的控制器的js代码：

$scope.user = {
    [...],
    lenght: "",
    pricecondition: "",
    isValid : function()
    {
        return false;
    }
};

因此，当属性长度或价格条件更改值时，函数isValid将被触发，但该按钮似乎不会重新评估user.isValid。该按钮显然启用，函数isValid返回false。

如何强制ng-disabled或ng-show再次调用isVlaid（）？

问候

Answer 1

您必须拥有一个带有name属性的表单元素才能使用＆＃34; form。$ invalid＆＃34;。如果表格无效或用户无效，我也会使按钮无效。

<form ng-submit="submit()" name="form" novalidate >
  <input id="pricecondition" name="pricecondition" ng-model="user.pricecondition" ng-focus="user.pricecondition=''" required />
  <button ng-disabled="form.$invalid || !user.isValid()">submit</button>
</form>

Answer 2

你的评论中有另一个问题，抱歉我起初没有注意到...... 使用formname而不是标签名称来禁用按钮......

<form name="myform" novalidate >
    // your html
    <button ng-disabled="myform.$invalid">submit</button>
</form>

或者如果表格中有表格，请使用ng-form

<form name="parentForm">
    <div ng-form="myform1">
        // your html
        <button ng-disabled="myform1.$invalid">submit1</button>
    </div>
    <div ng-form="myform2">
        // your html
        <button ng-disabled="myform2.$invalid">submit2</button>
    </div>
</form>

强制禁用和ng-show重新评估自定义功能

2 个答案: