Angular 7-Typescript语法

我只需要理解下面的语法。我正在html页面中为我的向导使用

archwizard

Library

HTML

<aw-wizard #wizard>
  <aw-wizard-step [stepTitle]="'Steptitle 1'" [canExit]="canExitStep1">
    <div class="centered-content">
      <div>
        Content: Step 1
      </div>

      <div class="checkbox">
        <input type="checkbox" />
        <label>Allow exiting step 1</label>
      </div>

      <div class="btn-group">
        <button type="button" class="btn btn-secondary" awNextStep>Continue</button>
      </div>
    </div>
  </aw-wizard-step>
</aw-wizard>

我感兴趣的是：

[canExit]=“canExitStep1”

和TypeScript部分中的

公共canExitStep1:（移动方向）

---

在typescript部分，这是一个函数吗？如何传递

MovingDirection

？基本上，我只需要理解从

html

部分到

typescript

部分的整个语法。

[canExit]

可以是

布尔值

或

函数

。该函数接受

MovingDirection

enum并返回

Promise

或

boolean

。此函数保存您需要执行的任何附加检查或验证，以确定该步骤是否可以退出（下一步和上一步）。如果在步骤更改过程中没有任何逻辑要执行，只需将

布尔值作为
[CanExit]
的值传入即可

为了便于理解，您可以像这样拆分函数声明和函数定义

声明：

public canExitStep1: (MovingDirection) => boolean;

定义：

 ngOnInit() {
    this.canExitStep1 = (direction) => {
      switch (direction) {
        case MovingDirection.Forwards:
          return true;
        case MovingDirection.Backwards:
          return false;
        case MovingDirection.Stay:
          return true;
      }
    };
 }

您可以在此处阅读有关
[CanExit]
函数的更多信息-

我很乐意澄清您仍然存在的任何疑问。
我已经阅读了文档，只是因为我无法为
[canExit]
编写函数，所以我在他们的
Github
中偶然发现了一个例子，就是上面的例子。那么这一部分是否意味着它是一个接受移动方向并返回布尔值的函数呢？如果是这样的话，那么语法对我来说有点奇怪：-）如果将声明和定义分开，可能更容易理解
canExit
方法。我已经像这样更新了答案。如果它现在点击，请告诉我。嗯，这是有道理的。非常感谢。
 ngOnInit() {
    this.canExitStep1 = (direction) => {
      switch (direction) {
        case MovingDirection.Forwards:
          return true;
        case MovingDirection.Backwards:
          return false;
        case MovingDirection.Stay:
          return true;
      }
    };
 }