Question

我有一个输入文本，在离子页脚内有两个按钮。一个按钮附加到表单提交。但是，如果我点击另一个按钮，它也会触发提交按钮。

代码如下：

<ion-footer padding>
    <form [formGroup]="chatForm" (ngSubmit)="sendChatMessage()">
        <button ion-button (click)="listenForSpeech()" clear><ion-icon name="microphone" isActive={{microphoneActive}} style="zoom:1.0;"></ion-icon></button>
        <ion-input type="text" #sendInput formControlName="messageInput" placeholder="start typing..."></ion-input>
        <ion-buttons end>
            <button ion-button clear type="submit" [disabled]="chatForm.controls['messageInput'].value === ''"><ion-icon name="ios-send" style="zoom:2.0;"></ion-icon></button>
        </ion-buttons>
    </form>
</ion-footer>

所以在这种情况下，如果我点击麦克风按钮，我也会看到sendChatMessage（）被激活。

Answer 1

在所有非提交按钮中添加type="button"

 <button ion-button type="button" (click)="listenForSpeech()" clear><ion-icon name="microphone" isActive={{microphoneActive}} style="zoom:1.0;"></ion-icon></button>

离子2角度：按钮单击里面的页脚也调用提交按钮

1 个答案: