zoukankan      html  css  js  c++  java
  • Angular项目TaskList service

    增删改查跟ProjectService很像

    import { TaskList } from './../domain';
    import { HttpClient } from '@angular/common/http';
    import { Inject, Injectable } from '@angular/core';
    import { count, map, mapTo, mergeMap, switchMap } from 'rxjs/operators';
    import { from, Observable } from 'rxjs';
    
    @Injectable({
      providedIn: 'root'
    })
    export class TaskListService {
      private readonly domain = 'TaskLists';
      private headers = new Headers({
        'Content-type': 'application/json'
      });
      constructor(private httpClient: HttpClient, @Inject('BASE_CONFIG') private config: any) { }
    
      //POST
      add(TaskList: TaskList): Observable<TaskList> {
        TaskList.id = undefined;
        const uri = `${this.config.uri}/${this.domain}`;
        return this.httpClient.post(uri, JSON.stringify(TaskList)).pipe(
          map(res => res as TaskList)
        )
      }
    
      //PUT/patch
      update(TaskList: TaskList): Observable<TaskList> {
        const uri = `${this.config.uri}/${this.domain}/${TaskList.id}`;
        const toUpdate = {
          name: TaskList.name //只更新name
        }
        return this.httpClient.patch(uri, JSON.stringify(toUpdate)).pipe(
          map(res => res as TaskList)
        )
      }
    
      //DELETE
      delete(taskList: TaskList): Observable<TaskList> {
        const uri = `${this.config.uri}/${this.domain}/${taskList.id}`;
        return this.httpClient.delete(uri).pipe(
          mapTo(taskList)
        )
      }
    
      //GET
      get(projectId: string): Observable<TaskList[]> {
        const uri = `${this.config.uri}/${this.domain}`;
        return this.httpClient.
        get(uri, { params: { 'projectId': projectId } })
        .pipe(
          map(res => res as TaskList[])
        )
      }
    
    
    
    }

    需要添加一个存储TaskList顺序,通过拖拽交换2个List的顺序。通过Patch更新Order。

    也就是要监听两个流merge和concat都行,一个事件流更新drag order,一个事件流更新drop order。

    希望这两个流先后更新之后再把得到的task list流返回,做一个reduce操作。

    //拖拽交换两个List顺序
      swapOrder(src: TaskList, target: TaskList): Observable<TaskList[]> {
        //拖拽的原始uri
        const dragUri = `${this.config.uri}/${this.domain}/${src.id}`;
        const dropUri = `${this.config.uri}/${this.domain}/${src.id}`;
        const drag$ = this.httpClient
          .patch(dragUri, JSON.stringify({ order: target.order }), { headers: this.headers })
          .pipe(map(res => res as TaskList));
        const drop$ = this.httpClient
          .patch(dragUri, JSON.stringify({ order: src.order }), { headers: this.headers })
          .pipe(map(res => res as TaskList));
        return concat(drag$, drop$)
          .pipe(reduce((r: TaskList[], list) => [...r, list], []));
      }

    如果觉得本文对您有帮助~可以支付宝(左)或微信支持一下:


    看到小伙伴打赏时给我写一些鼓励的话,真的非常感动,谢谢你们。


    我开了个微信公众号(第三个二维码)用来分享自己的职场英语相关学习经验,感兴趣可以关注,我会不断更新~


    微信打赏微信公众号

  • 相关阅读:
    七牛云上传文件
    微博三方登录
    异步任务 --- django-celery
    阿里云短信服务
    Redis五大数据结构和使用方法
    千万不要买我们家的鞋子!
    Firebug控制台详解
    【转】android 按home键返回到桌面后,再按桌面应用图标又重新打开该应用的解决方法
    【转】android中webview使用的一些细节
    JSONException: Value of type java.lang.String cannot be converted to JSONObject
  • 原文地址:https://www.cnblogs.com/starof/p/14439196.html
Copyright © 2011-2022 走看看