发表于: 2017-05-24 21:51:57

1 849


2017-05-24 Day064

今天完成的事情

  1. 1. 今天总体来说没干什么事情,只是将任务5服务器返回的登录结果显示在了页面上:
    函数getLogMes(user: User): Observable<CurrentUser>{}返回的是什么?返回数据类型由自己定义,但是必须和后端返回的数据一致,才能保存并读取,之前设置的返回数据是Observable<User>所以返回的是一个User类型的流,这样数据虽然可以保存,但是大部分的数据都流失了。比如在取得数据时console出的结果是没有问题的,但是当订阅了这个流之后,返回的数据就是undefined,今天为了这个事情翻阅了很多Rxjs资料,显然很复杂大部分都看不懂,纠结于subscribe到底做了什么,当弄懂了它只是订阅了Observable这个流,并且取得了它的数据之后,一切就变得明朗了:
 login() {
   console.log('enter login()');
   this.loginService.getLogMes(this.user)
     .subscribe(currentUser => {
       this.currentUser = currentUser;
       console.log(`loginComponent_${this.currentUser.message}`);
       this.showLoginMsg(this.currentUser.message);
     }
   );

这样很自然就取得了返回的数据。
2. 将返回的登录结果显示在页面,这个就很简单,直接插值:

 private showLoginMsg(msg: string): void {
   if(msg) {
     this.logMsg = msg;
   }
 }
<p class="tips">{{logMsg}}</p>

明天计划的事情

完成了登录接下来就是表单验证,那么明天:

  1. 1. 学习ng4的表单验证方式并完成表单验证;
  2. 2. 登录后的页面跳转,使用的是路由对吧。

遇到的问题

除了上面的第一点解决了之前还有3个问题:

  1. 1. 在取得数据的时候,由于数据是json格式,就新建了一个user-model.json的json文件,定义和返回数据一致:
{
 "CurrentUser": {
   "code": 0,
   "data": {
     "manager": {
       "createAt": "",
       "createBy": "",
       "id": "",
       "name": "",
       "nick": "",
       "status": "",
       "updateAt": "",
       "updateBy": ""
     },
     "result": "",
     "role": {
       "createAt": "",
       "createBy": "",
       "id": "",
       "name": "",
       "nick": "",
       "status": "",
       "updateAt": "",
       "updateBy": ""
     },
     "size": "",
     "total": "",
   },
   "message": "",
 }
}

这样是打算将获得的数据保存在这个文件中,方便后面读取,但是想到保存就头大了,这样的数据怎样一次保存?总不可能按照键名和键值一一对应过去吧。。。于是放弃了。。还有一个原因就是这个文件如何读取?
2. 表单的属性中有一个required属性,当给页面设置了这个属性之后,如果不输入直接点击提交,就会提示输入,但是实际上没有效果,很尴尬。
3. 第三个问题,开玩笑怎么会有第三个。。。


哦,是我忘了确实有第三个问题,

   console.log(`${body}`);
   console.log(body);

上面是打印服务器返回的数据,看上去是没有什么区别的对吧,然而打印的结果令人很伤感,
第一个打印的是[object: object],第二个打印的就是json对象,据说是console.log()自带toString()方法,不明所以。。

收获

倍感欣慰的是抄的代码终于弄懂了,虽然改过了,但毕竟是抄的。
Rxjs就是茫茫大海,我不知你深浅。。。



返回列表 返回列表
评论

    分享到