Question

下面给出的代码在我的角度html文件中不起作用，但如果我在html文件中单独使用此代码，它可以工作，我不知道我做错了这只是一个简单的表单。

<form action='https://easypaystg.easypaisa.com.pk/easypay/Index.jsf' method='post'>
    <input  name='storeId' value='4950'>
    <input  name='amount' value='1000'>
    <input  name='postBackURL' value='https://easypaystg.easypaisa.com.pk/easypay/Confirm.jsf'>
    <input  name='orderRefNum' value='123113'>
    <input  name='merchantHashedReq' value='6ohsP8x3PpiaI4oNirWGwjVkyMLP4CbzcH6pZwvu9SViOzx9nLxyR/TtJhwFrxBU686Wf1z22G+TBxuo5QkSscuXp266qQWx8AbGWnLXxG79LHt+5VlD+lH2JkjKO997adwVHH6mGNm8ldtAKkRyf/E92QF5PwhWMjq8i4dlbABIjJxnwPS3x13R/Nbfmlugkz7XpX20DmZ0IhPuGBR95sOpDATIjfW51fuStCVVni4='>
    <input  name='autoRedirect' value='0'>
    <input  name='paymentMethod' value='CC_PAYMENT_METHOD'>
    <input  name='emailAddr' value='johndoe@live.com'>
    <input  name='mobileNum' value='0123455500'>
    <button type="submit" class="btn btn-success" >Submit</button>
    <input type='submit' value='asdasd' class="btn">
</form>

Answer 1

您可以通过以下方式执行此操作：

<form #form action='https://easypaystg.easypaisa.com.pk/easypay/Index.jsf' method='post'>
    ...
    <button type="submit" class="btn btn-success" (click)="form.submit()">Submit</button>
    ...
</form>

Answer 2

直接发布表单会导致页面重新加载，这通常不是您在Angular应用程序（SPA）中所需的内容。从表单中获取数据并将代码中的HTTP请求发送到服务器。

您应该使用NgSubmit指令，如here

所述

Answer 3

使用ngNoForm属性as documented。这样可以防止所有“不可思议的” Angular行为，并且您将能够以本机方式提交表单（并重新加载页面）。

类似于以下内容：

<form ngNoForm action='https://easypaystg.easypaisa.com.pk/easypay/Index.jsf' method='post'>
    <input  name='storeId' value='4950'>
    ...
    <input type='submit' value='asdasd' class="btn">
</form>

具有Action的Angular 5简单形式不起作用

3 个答案: