페이징 처리하기 Angular With Spring

어느분의 코드를 보다가 배울점이 있어서 간단히 프로토 타입코드로 작성해보았다. 

 

---

========= Angular js ===========

---

1. Pagenation 이라는 클래스를 만들어서

 view에서 검색관련한 이벤트 등이 있을 경우 페이징 할 때 필요한 변수들을 받아놓는다. 

export class Pagination {
  // 다음 가져올 시작 부분
  offset: number;
  // 한번에 가져올 양
  limit: number;
  // 소팅 조건
  sortOption [
    {
      prop: string;
      dir: string;
    }
  ];
  // 검색 조건 및 정보
  searchOption: 'AND' | 'OR';
  searchwords: string[];
  
  
  //생성자로는 기본값을 설정했다 .!!
  constructor(type?: string) {
    this.searchOp = 'OR';
    this.keywords = [];

  }
}

 

2. 앵귤러의 Service에서

 showListPagePostslist ( pagination: Pagination ) 이라는 함수를 정의한다.

import { Pagination } from '@model/common/pagination';
  
  
Postslist(pagination: Pagination): Observable<any> {   //pagenation 을 변수로 받는다.
    const params: any = {
      index: pagination.offset,                        //offset 과 limit 뽑아서 파라미터에 넣음.
      size: pagination.limit                           //파라미터에는 스프링의 변수이름과 맞춰주자.
    };

    if (pagination.sortOption) {                        //sort가 정해져있다면
      params.sortOption= `${pagination.sortOption[0].prop};${pagination.sortOption[0].dir}`;  //파라미터에 넣음
    }

    if (pagination.keywords && pagination.keywords.length > 0) {    //keyword가 있다면
      params.searchOption = pagination.searchOption;                //검색카테고리와 키워드 파라미터에 넣음
      params.searchWords = pagination.searchWords;
    }

    return this.api.get(`${BASE_PATH}/Postslist`, params);  // 파라미터와 함꼐 http요청을 보내준다.
    													    // backend에 listPage라는 함수가 있다.
  }

 

---

=========Spring Rest ==============

---

 

------------PostsListController.class ------------

@RequestMapping(value = "PostsList/{typeCd}")
public ApiResponseDto getList(    @RequestParam(value = "index") int index,
                                  @RequestParam(value = "size") int size,
                                  @RequestParam(value = "sortOption", required = false) String[] sortProperties,
                                  @RequestParam(value = "searchWords", required = false) String[] keywords,
                                  @RequestParam(value = "searchOption", required = false) String searchOp) throws BackendException {
         
       return PostService. getPostsList(index, size, sortProperties, keywords, searchOp));
       
    }

------------ PostsService.class -------------

    public PageWrapper getListPage(int index, int size, String[] sortOptions[],String[] searchWords, String searchOption) throws BackendException {
       
       PageRequest pageRequest =new PageRequest(index, size, sortOptions);

		if(  keywords가 있다면 ) 
             검색조건 = searchKeywords(keywords, searchOp));
        

        Page<Posts> page = PostsRepository .findAll( 검색조건 , pageRequest );
        return page;
    }