打开页面时，Clarity Wizard不会打开

Question

所以我有一个带有提交按钮的登录页面，只要用户名和密码正确就会加载新页面。 这工作正常，但在下一页我想要一个向导弹出。

我正在使用 Angular + VMWare Clarity 。

问题是，如果我把：

<button [disabled]="loading" class="btn btn-primary" (click)="wizard.open()">
    Login
</button>

这会重定向到向导而不先进行身份验证。因此，如果用户名和密码不正确，则无关紧要。

您是否知道在表单正确提交后弹出向导的其他任何方法？或者，如果我可以以某种方式使表单提交后向导弹出而不需要按钮功能吗？

Answer 1

因此，当单击按钮时，您的(click)="wizard.open()"事件处理程序将触发，而不是在表单响应之后触发。这不是Clarity特有的，只是JavaScript中事件的逻辑顺序。在收到响应之前，点击几乎总会触发，因此您希望在收到响应时打开向导。

有两种基本方法。 1）在输入绑定中设置打开状态或2）获取向导组件并以编程方式调用open方法。

1. 您的向导应将[(clrWizardOpen)]绑定设置为值<clr-wizard [(clrWizardOpen)]="wizardState">。处理响应时，可以设置this.wizardState = true以触发向导打开。

2. 在控制器中，您可以使用@ViewChild(ClrWizard) wizard: ClrWizard;在控制器上设置一个具有向导引用的属性。然后在您的响应处理程序中，您可以this.wizard.open()打开它。