Question

已编辑：以下代码已简化，禁用的属性将无济于事。我有一个表单，当我根据表单的成功或失败提交表单时，我希望模型弹出-仅在表单值正确时。模态按钮应与提交表单按钮组合

Answer 1

如何在HTML文件本身中添加条件。

<button type="button" (click)="(2+3 > 1) && onConditionApply()">trigger here!</button>

基本上是标准的JavaScript样式的代码。

根据已修改的问题进行回答

我仍然不清楚这个问题。但是，让我尝试一下。

formSubmitted() {
    this.httpClient.post().subscribe(
        (response) => {
            // Make Show Modal button enabled/Unhide Modal show button.
            // Trigger Modal button to show popup
        });
}

基本上，我认为表单提交是异步调用，然后只需订阅它并在成功回调中执行操作即可。

关于“ 仅在表单值正确的情况下”，

<div #f="ngForm"></div>
<button [disabled]="f.invalid"></button>

上面，我只是想根据表单的有效性状态启用/禁用按钮。如果需要在组件ts文件中访问此值，则需要在TS文件中添加@ViewChild() f，然后才能以相同的方式访问内容。

它可能不会直接回答您的问题（因为我不清楚要求到底是什么），但可能会为您提供正确方向的指点。

希望这会有所帮助。

Answer 2

在.ts文件中

export class ClassName{
  allowButton = false;

onConditionApply() {
    if (2 + 3 > 1) {
      allowButton = true;
    }
   }
  }

在HTML文件中。

<button type="button" class="btn btn-primary" [disabled]="allowButton" data-toggle="modal" data-target="#myModal">Open modal</button>

如何有条件地触发Angular中的click事件？

2 个答案: