在同一页面上多次使用的自定义指令中的验证（AngularJS）

Question

我创建了一个包含相关输入和下拉列表的自定义指令。我还使用了一个隔离范围来正确地将外部范围绑定到内部范围以协助两个数据绑定，这也允许我在同一页面上多次使用相同的指令。到目前为止，一切都很顺利。我的下一个问题是如何在指令中处理验证。

我再也不能使用

的内容了

ng-show="formName.controlname.$invalid && !formname.controlname.$pristine" 

出于以下两个原因，

1. 我的指示不应该担心外部形式。
2. 因为我在同一页面上使用了两次相同的指令，所以使用语法formName.controlname实际上会映射到两个不同的控件。

关于这一点的一些想法在这一点上会有所帮助。我在这里缺少什么？

Answer 1

你绝对不应该让你的指令取决于表单名称。你应该做的是提供一个父表单指令依赖项，这样你就可以在你的指令链接函数中使用它的控制器：

.directive('yourDirective', function() {
    return {
        require: '^form',
        link: function(scope, element, attrs, formController) {
            // use formController.$errors object
        }
    };
});

Answer 2

您可能应该在指令中进行验证。

创建双向绑定范围成员的副本（假设这些成员绑定到表单输入）以检查pristine-ness和undo-ability。

Answer 3

感谢您的反馈，但我发现使用ng-form符合我的要求。

所以在我的指示标记中我添加了：

   <div ng-form="[some name]">
     .......
   </div>

这样做让我继续使用ng- *属性。

现在我可以在我的指令中执行此操作：

ng-show="somename.controlname.$invalid && !somename.controlname.$pristine" 

它是独立的，所以我不必担心越过任何边界。我可以一遍又一遍地添加控件，并且每个指令的验证都保持不变。