来自多个组件的AngularJS验证

我正在开发一个小型AngularJS（1.6）应用程序，尝试使用基于组件的体系结构

在HomePageComponent上，我有三个不同的子组件A、B和C，它们都包含不同的内容，如输入字段、日期选择器和列表。如果我的任何子组件中的验证失败，则不可能导航到下一页（状态）。因此，应禁用“按钮A”-未设置组件A中的“名称”输入字段

然而，我似乎找不到一个合理的解决方案/模式来说明如何在使用组件时实现此功能

有人对此有合适的解决方案吗？

---

提前感谢

你可以考虑使用<代码>向导< />代码>。从github页面：

<wizard on-finish="finishedWizard()" on-cancel="cancelledWizard()"> 
    <wz-step wz-title="Starting">
        <h1>This is the first step</h1>
        <p>Here you can use whatever you want. You can use other directives, binding, etc.</p>
        <input type="submit" wz-next value="Continue" />
    </wz-step>
    <wz-step wz-title="Continuing">
        <h1>Continuing</h1>
        <p>You have continued here!</p>
        <input type="submit" wz-next value="Go on" />
    </wz-step>
    <wz-step wz-title="More steps">
        <p>Even more steps!!</p>
        <input type="submit" wz-next value="Finish now" />
    </wz-step>
</wizard>

这是第一步
在这里你可以用你想要的任何东西。您可以使用其他指令、绑定等

持续的
你继续在这里

更多的步骤

谢谢-我会查看它。在HomePageComponent中，如果添加

嵌套组件中的任何输入和验证都将参与外部表单验证