Question

我有一个输入字段和一个按钮，用户可以在其中输入要进行地理定位的地址。它是更大形式的一部分，但我希望在按下“Map it”按钮而不是最终表单提交时处理该字段的有效性。如何将此字段设置为无效？调用$setValidity会导致未定义/不是函数错误。

表格位：

<form name="myForm">
  <input type="text" name="addy" ng-model="addy">
  <a ng-click="geoCode()">Map it!</a>
  <span class="error" ng-hide="myForm.addy.$invalid">Bad field</span>
  ....
</form>

控制器：

$scope.addy = null

// This is a more complex async function trimmed down to essentials
$scope.geoCode = function() {
  $scope.addy.$setValidity('unique', false);
});

我也希望只检查一次这个字段。因此，如果他们输入一个地址并且没有按下Map it按钮，那么它将在提交时被检查，但是如果他们确实按了Map按钮并且字段有效则它将不会再次通过异步功能。关于如何最好地处理这个的建议？

Answer 1

如果您想在控制器中设置输入字段的validity，只需传递表单并像在标记中一样访问输入。我还提供了一个工作示例：

＆＃13;

var app = angular.module('form-example', []);

app.controller('FormCtrl', function($scope) {
  var vm = this;

  vm.geoCode = function(form) {
    form.addy.$setValidity('unique', false);
  };
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>

<form ng-app="form-example" name="myForm" ng-controller="FormCtrl as vm">
  <input type="text" name="addy" ng-model="vm.addy">
  <a ng-click="vm.geoCode(myForm)">Map it!</a>
  <span class="error" ng-hide="myForm.addy.$invalid">Bad field</span>
</form>

＆＃13;

在控制器中调用angular $ setValidity

1 个答案: