强制ng-disabled和ng-show重新评估自定义函数

force ng-disabled and ng-show to reevaluation custom function

本文关键字:评估 自定义函数 新评估 ng-disabled ng-show 强制      更新时间:2023-09-26

我想验证一个表单与我的自定义js函数"isValid"。我这样做了:

<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。

这是我的控制器的js代码:
$scope.user = {
    [...],
    lenght: "",
    pricecondition: "",
    isValid : function()
    {
        return false;
    }
};

因此,当属性长度或价格条件改变值时,函数isValid被触发,但按钮似乎没有重新评估user.isValid。按钮被启用,函数isValid返回false。

如何强制ng-disabled或ng-show再次调用isvlay () ?

问候

你从你的评论中得到了另一个问题,抱歉我一开始没有注意到…使用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>

必须有一个带有name属性的表单元素才能使用"form.$invalid"。此外,如果表单无效或用户无效,我将使按钮无效。

<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>