发表于: 2017-05-11 21:42:19

1 950


2017-05-11 Day051

今天完成的事情

完成了一个表单验证的demo,代码是抄的,虽然是抄,单仍然是 问题不断。
a. 只使用了一个住组件app.component,一个附加组件hero-from.compoent,并没有使用依赖注入,使用了简单了import
b. 虽然这样使用有一个明显的缺点,就是在hero-form.component的子组件hero(这个如果用依赖注入可以写成一个服务)如果更改,hero-form.component也相应的更改,但是为了理清逻辑,和如何在Angular 2中使用表单验证;
c. bootstapAngular 2中虽然可以用导入的方式,单纯依然使用了<link>,原因,,不会。

明天计划的事情

  1. 表单验证花的时间比想象中的长,刚刚才看到依赖注入,发现了一个很严重的问题,这章好长。。明天看完。
  2. 据我所知依赖注入有两种方式(maybe 3),第一种已经理解了,问题就出在后面的第二种,明天一定要理解,并实现demo。

遇到的问题

问题不是很多,都是小问题。改改就好了。

收获

Angular 的语法还是比较有特色的,它有自己的方法,有自己的css类名

   <form (ngSubmit)="onSubmit()" #heroForm="ngForm">
     <div class="form-group">
       <label for="name">Name</label>
       <input type="text" class="form-control" id="name"
              required
              [(ngModel)]="model.name" name="name"
              #name="ngModel">
       <div [hidden]="name.valid || name.pristine"
            class="alert alert-danger">
           Name is required
       </div>
     </div>
   </form>
  1. 比如表单的值是否有效valid,表单是否被点击过pristine,等等,我们就可以根据这些类,来做出一些判断。
  2. 这里面包含了[hidden]的属性绑定,[(ngModel)]双向绑定.
  3. 以及一个h5的属性required



返回列表 返回列表
评论

    分享到