如果$ invalid禁用按钮角度

Question

我无法弄清楚为什么以下代码无法正常工作。 我正在关注此处的答案以及其他各种教程/答案，但是当字段为空时，该按钮不会处于禁用状态。

<h3>Add address</h3>
<div ng-include="'app/views/partials/form.html'"></div>
<button ng-click="ctrl.cancelAddress()">Cancel</button>
<button ng-disabled="addressForm.$invalid" class="save-btn" ng-click="ctrl.saveAddress(ctrl.name, ctrl.address, ctrl.country)">Save</button>

app / views / partials / form.html

<form name="addressForm" novalidate>
    <input ng-model="ctrl.name" type="text" name="RecipientName" required>
    <p ng-show="addressForm.RecipientName.$error.required">Username is required</p>

    <input ng-model="ctrl.address" type="text" name="AddressLineOne" placeholder="Address" required>
    <p ng-show="addressForm.RecipientName.$error.required">Address is required</p>

    <select ng-model="ctrl.country">
       <option ng-repeat="country in ctrl.countries" value="{{country.name}}">{{country.name}}</option>
       <p ng-show="addressForm.addressCountry.$error.required">Username is required</p>
    </select>
</form>

Answer 1

我将它们作为更方便访问的答案。

addressForm在您引用它的（外部）范围中不存在。 它只能在存在的<form>元素内引用。 您需要将这些控件放在<form>内的任何位置，以使其起作用。

您的表单是否知道您是否正在编辑？ 因为这样的话，您可以将这些按钮移到表单中，然后使用ng-if="ctrl.isEditing" 。 当然， ctrl.isEditing将替换为您知道的任何可用编辑方法。