向导步骤中的 stepEnter 或 canEnter 在 Archwizard 中不起作用 Angular 9

Question

我尝试在我的应用程序中使用 angular Archwizard（最新版本），它工作正常但是当我尝试对我从步骤 1 发送到步骤 2 的变量进行一些控制时，在第 2 步它将做的工作取决于这个变量，我使用 [canEnter] 和 (stepEnter) 但它似乎对我不起作用，这里是 slackbitz 中的 link 我正在尝试做的事情https://stackblitz.com/edit/angular-ps1k5n?embed=1&file=src/app/app.component.html&view=preview

Answer 1

您的 first-step.component

中存在数据类型处理问题

这个html地区

  <option  value="true"> True </option>
  <option value="false"> False</option>

还有你的 TS

 saveFlag() {
    this.status = this.firstForm.controls['type'].value; // this one returns a string;
    this.sendFlag.emit(this.status);
  }

Hence, your status is string not a boolean

所以在你的 app.component 中这样做

  getRequestStatus ($event){
    this.status = $event === 'true';
    this.finishedStep1 = true;
  }

关于这个有几个解决方案，但这是最简单的部分。

向导步骤中的 stepEnter 或 canEnter 在 Archwizard 中不起作用 Angular 9

stepEnter or canEnter at step in wizard doesn't work in Archwizard Angular 9

angular

angular-reactive-forms

wizard