angular4 表单提交 和 数据交互到后台 总结

 

1.表单数据提交  从模板HTML 到组件component

效果图

先从模板HTML说起来

1)主要的标签是input 添加  双向绑定 [(ngModel)]="username" name="username" 绑定必须有name属性值对应名称

2）提交表达数据

①定义form表单提交事件 （ngSubmit）="onsubmit(表单提交值)"  这里的表单提交值就是regForm.value

 

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

 

 

完整的HTML

 

组件内component

定义onsubmit函数

 

参考

Angular 4 表单快速入门