在 angularjs 1.5 组件中设置有效性

Posted 2023-02-23

【中文标题】在 angularjs 1.5 组件中设置有效性

【英文标题】：Set validity in angularjs 1.5 component

【发布时间】：2017-08-12 06:38:42

【问题描述】：

Angularjs .directives 中的链接函数在网上有很多例子来操作 dom

require: 'ngModel',
link: function(scope,elem, attr,ctrl)
    ctrl.$setValidity('element-name', false);
// and setting has-error
    elem.parent().hasClass('has-error');

在 Angularjs 1.5 es5 .component 上这种工作是如何完成的？

我已经看到你可以注入$element,$attrs，尽管没有任何人使用它们或如何注入 ngModel 作为 ctrl 来设置有效性的例子。我是否错过了一些超级简单的东西，每个人都知道如何做到这一点，或者没有人尝试在组件中使用这些。

【问题讨论】：

这篇 *** 帖子应该对您有所帮助 ***.com/questions/36721551/…

@Pramod_Para 我说不是.directive 我正在尝试在组件中完成此操作。或者这只是组件中无法完成的事情。

您的意思是不使用任何角度组件？

@Pramod_Para .component 是一个特定的组件，例如 Angular2 组件 example。

是的，您可以在 angular.component 中设置有效性。但其中没有支持链接功能，您可以使用它来设置有效性。但是您可以提出另一种解决方案来设置验证，这基本上涉及将元素嵌入到表单标签中。您可以在组件的控制器工厂函数中获取此表单引用，并设置有效性。

【参考方案1】：

是的，您可以在 angular.component 中设置有效性。但是其中不支持链接功能，您可以使用它来设置有效性。但是您可以提出另一种解决方案来设置验证，这基本上涉及将元素嵌入到表单标签中。您可以在组件的控制器工厂函数中获取此表单引用，并设置有效性。

【讨论】：

以防万一人们想知道如何为输入提供错误或成功大纲。这取决于您使用的是什么。我正在使用引导程序，所以我把ng-class=" 'has-error': $ctrl.formName.inputName.$invalid, 'has-success': $ctrl.formName.inputName.$valid" and have this.$onInit` fn 更改为输入的有效性。

以及我的组件与表单项的连接。 this.formName.inputName.$setValidity('formName,inputName', false) 无效。