angular如何实现form表单的提交

云俊名
2023-12-01

1)、创建html (主要的标签是input 添加  双向绑定 [(ngModel)]="intervalTime" name="intervalTime"绑定必须有name属性值对应名称)参考网址:http://www.cnblogs.com/xxx91hx/p/7923237.html

2)提交表达数据

①定义form表单提交事件 (ngSubmit)="saveSetting(表单提交值)"  这里的表单提交值就是#formCont="ngForm"

②表单使用angular的ngForm   #regForm="ngForm"

 

<form (ngSubmit)="saveSetting(formCont.value)"  #formCont="ngForm">

<li>间隔时间(毫秒):<input type="text" value="600" [(ngModel)]="intervalTime" name="intervalTime"/><span>范围50-50000</span></li>

<li>呈现时间(毫秒):<input type="text" value="400" [(ngModel)]="presentationTime" name="presentationTime"/><span>范围50-50000</span></li>

<button class="saveCurrent" type="submit">

保存当前值

</button>

</form>

 

3)组件内component

//保存当前设置数据

saveSetting(value){

console.log(value);

return false;

}

 

 

 

 类似资料: