传递给指令AngularJS的表单上的验证不起作用

时间:2014-09-02 02:26:10

标签: javascript html angularjs

我正在使用AngularJS构建Web应用程序,我有一个疑问,因为我不知道实现使用输入表单的指令的最佳方法是什么。我有以下指令:

angular.module('myApp').directive('personal', [function () {
    return {        
        restrict: 'E',
        scope : {
            model : '=ngModel',
            label : '@',
        },
        require: '^form',
        templateUrl : 'personal.html',
        link: function (scope, iElement, iAttrs, ngModelController) {}
    };
}]);

personal.html

<input type="text" name="name{{label}}" ng-model="model.name" ng-pattern="/^[A-Za-z]*$/">
<div class="error-container" ng-show="data.name{{label}}.$invalid">
    <small class="error" ng-show="data.name{{label}}.$error.pattern">Invalid format</small>
</div>

的index.html

....
<form novalidate name="data">
   <personal label="personal" ng-model="general"></personal>
  <!-- here I will need add more tags 'personal' ..is a requirement -->
</form>
...

表格很好。但是..当输入名称{{label}}包含无效内容时,错误消息未显示(如果我将templateUrl内容放在index.html上,那就有效)。

感谢您提前。

1 个答案:

答案 0 :(得分:0)

您的templateUrl中的data.whatever无法访问表单控制器。您已创建隔离范围,因此无法访问表单name = data。我现在不在我的电脑上,所以我不能给你坚实的例子,而是阅读表格控制器。