时间戳

首页 > 解决方案 > Angular 2 离子形式

javascript - Angular 2 离子形式

问题描述

我正在尝试使用 ionic 提交 Angular 表单

<form method="post" class="form-horizontal" action="https://localhost:44370/Account/ExternalLogin">
    <div>
        <p>
            <!-- ion-button block [disabled]="isDisabled" -->
            <button 
                name="provider" value="Coinbase" type="submit"
                title="Log in using your Coinbase account">
                Coinbase
            </button>               
        </p>
    </div>
</form>

但是，当我单击提交按钮时，什么也没有发生。

标签： javascripthtmlangulartypescriptionic-framework

解决方案

使用 angular 提供的ngForm（模板或响应式方式）。也为您按钮创建两次，一次无效，另一次具有有效表单状态。

采用(ngSubmit)="onSubmit()"

<form #form method="post" (ngSubmit)="onSubmit()" class="form-horizontal" action="https://localhost:44370/Account/ExternalLogin">
    <div>
        <p>
            <button ion-button block [disabled]="isDisabled" type="submit" title="Log in using your Coinbase account">
                Coinbase
            </button>
            <input type="hidden" name="provider" value="Coinbase">
        </p>
    </div>
</form>

PD：明智的做法是始终验证要以编程方式提交的数据以避免 XSS 攻击。

推荐阅读