Question

我在一个带有2个按钮的页面中有一个表单。一个是触发计算价格的函数，另一个是表格的真实提交。

这是一个简单的例子：

<form novalidate name="formStep1">
  <select ng-model="address" required>
     <option></option>
     <option></option>
  </select>

  <input type="text" ng-model="weight" />

  <label>{{price}}</label>

  <button ng-click="getPrice()" />
  <button value="submit"/>

</form>

我需要触发所有验证器，比如$ error和$ submit，将ng-class放在表单的select和input标签上，因为什么时候我需要所有带文本的输入。

感谢。

Answer 1

在form {} {}}中，您有两个不会分配name属性的字段。要将这些字段作为表单的一部分，您需要将name属性分配给这些元素。将name属性添加到角色表单后，验证将开始显示其感染。

您还可以使用submitted标记来保持表单跟踪是否已通过getPrice()方法提交。点击即可将该标记设为true＆amp;在使用ng-class

进行验证时使用它

<强>标记

<form novalidate name="formStep1">
  <select ng-class="{'error': submitted && formStep1.address.$invalid}" name="address" ng-model="address" required>
     <option></option>
     <option></option>
  </select>

  <input ng-class="{'error': submitted && formStep1.weight.$invalid}" type="text" name="weight" ng-model="weight" />

  <label>{{price}}</label>

  <button ng-click="submitted=true; getPrice()" />
  <button value="submit"/>

</form>

Answer 2

用@ Pankaj的帮助回答自己：

在输入中使用所有名称并将formStep1作为getPrice函数中的参数传递，我可以访问输入验证，如：

$scope.getPrice = function (form) { 
  if(!form.nameOfInput.$dirty) { 
    form.nameOfInput.$invalid = true; 
  } else {
    // GET PRICE
  }
}

如果需要在无提交按钮中验证输入，这是一个很好的方法吗？

在＆＃34;假＆＃34;中进行角度形式验证提交

2 个答案: