角度条件运算符:执行多个语句

Question

这是逻辑：在输入时，执行以下if语句

if (!elementB.isOpen){
elementB.open()
else {
elementC.open()
elementC.focus()
elementB.close()
}

我想使用 ？ 条件运算符并将其添加到 (keyup.enter( 之后：

<mat-form-field (keyup.enter)="!elementB.isOpen ? elementB.open() : elementC.open();elementC.focus();elementB.close()">

但是上面的代码给了我一个错误。似乎我无法使用conditional operator( ? : )执行多行代码.

谁能帮我解决这个问题？谢谢！

Answer 1

使用组件文件，而不是在模板中塞满逻辑：

<mat-form-field (keyup.enter)="elementActions()">

在组件中：

public elementActions(): void {
if (!this.elementB.isOpen) {
elementB.open();
} else {
this.elementC.open();
this.elementC.focus();
this.elementB.close();
}
}

我知道这非常平凡，但这就是 component.ts 文件真正应该用于的用途。

Answer 2

尝试在方法中给出else，以便简化逻辑

<mat-form-field (keyup.enter)="!elementB.isOpen ? elementB.open() : changeElement(elementC,elementB)">
changeElement(elementC: any, elemenB: any) :void {
elementC.open();
elementC.focus();
elementB.close();
}

Answer 3

用括号括起来

<mat-form-field (keyup.enter)="!elementB.isOpen ? (elementB.open()) : (elementC.open(),elementC.focus(),elementB.close())">