(十五)、Angular4.0 模板式表单

2019-04-14 16:10发布生成海报

站内文章 / 模拟电子

15217 0

一、新建一个demo项目ng new demo4二、在demo4项目中新建一个组件ng g component templateForm三、表单由angular管理，简单模板式表单示例HTML --> template-form.component.html


  
    用户名:
    手机号:
  
  密码:
  确认密码:
  


  {{myFrom.value | json}}


  {{username.value}}


  {{mobile.value}}

四、template-form.component.ts 中定义一个简单的onSubmit方法，把传入的参数打印到控制台

  onSubmit(value: any) {
    console.log(value);
  }

五、在app.component.html中使用template-form组件

六、启动项目，访问localhost:4200，查看简单模板式表单示例七、重构模板表单，去处多余的代码


  用户名:
  手机号:
  
    密码:
    确认密码: