如何在指令窗体中的元素上设置有效值？

我有一个链接到窗体上的文本框的指令，我希望这个指令设置'required'错误。如何在指令窗体中的元素上设置有效值？

这里有一个小提琴，显示什么，我试图做

http://jsfiddle.net/scottieslg/7qLsj3rr/3/

HTML：

<div ng-app='myApp' ng-controller='TestCtrl'> 
    <ng-form name='testForm'> 
     <input type='text' name='myInput' /> 
     <div ng-messages="testForm.myInput.$error"> 
      <div ng-message="required">Required</div> 
     </div> 
     <test-directive ng-model='testModel'></test-directive> 
    </ng-form> 
</div>

的Javascript：

var app = angular.module('myApp', ['ngMessages']); 

app.controller('TestCtrl', function($scope) { 
    $scope.testModel = {} 
}); 

app.directive('testDirective', function() { 
    return { 
     restrict: 'E', 
     require: 'ngModel', 
     template: '<div><button ng-click="setError()">Set Error</button></div>', 
     link: function(scope, element, attrs, ngModelCtrl) {    
      scope.setError = function() { 
       // How can I set .setValidate('require', true) on myInput from here?? 
      } 
     } 
    } 
});

来源

2015-03-08 Scottie

为什么你需要'test-directory'的'ng-model'？ – 2015-03-08 19:09:10

从你的问题中不清楚你想要做什么，请更新你的问题 – 2015-03-08 19:35:04

当字段有值时，你不能假装'required'验证器应该失败。我认为你可能有兴趣创建你的[自定义验证逻辑]（https://docs.angularjs.org/guide/forms#custom-validation）。 – fracz 2015-03-08 19:46:56

如果你想在test-directive是能够控制ngModelController实例在表单中单独指定的输入上，则再次使用ng-model指令不是正确的做法，因为这将在test-directive上创建新的ngModelController实例。

什么test-directive实际需要知道的是名具有控制器输入：

<test-directive name='myInput'></test-directive>

然后，它可以访问表单控件，使用

require: '^form',

，并使用name属性值在窗体上查找ngModelController实例：

link: function(scope, element, attrs, formController) {    
    scope.setError = function() { 
    var ngModelCtrl = formController[attrs.name]; 
    ngModelCtrl.$setValidity('required', false); 
    } 
}

你可以在http://jsfiddle.net/7qLsj3rr/6/看到。

注意：如果您使用的是required作为键，那么只要您再次输入输入，角度自己的required验证将启动一个删除错误。

来源

2015-03-08 19:58:02

如何在指令窗体中的元素上设置有效值？

回答

相关问题